如何使用 draw.io 桌面版:离线绘图与批量导出完整指南
【免费下载链接】drawio-desktopOfficial electron build of draw.io项目地址: https://gitcode.com/GitHub_Trending/dr/drawio-desktop
draw.io 桌面版是一个基于 Electron 的离线图表绘制工具,不联网也能画流程图、UML 图、网络拓扑图,并直接导出为 PNG、SVG、PDF、JPEG、XML、HTML 六种格式,还支持用命令行批量转换整个目录的图表文件。本文按"安装 → 界面 → 导出 → 常见问题"的顺序,讲清这台免费的(Apache 2.0 许可)工具怎么用,目标是 10 分钟内上手。
离线能用吗?图表数据会去哪里
先回答最常见的顾虑:桌面版的设计目标就是"与互联网完全隔离"。启动后唯一的网络请求是版本更新检查(见下文,可关闭),所有 JavaScript 都内置在应用里,浏览器层的 Content Security Policy 禁止执行任何远程脚本。你的图表内容不会发到外部,应用也不收集任何使用统计。
有一点要注意:如果图表文件里用 URL 引用了外部图片、背景或字体,打开文件时会去请求这些资源以保证渲染正确。所以打开来源不明的 .drawio 文件时,相当于会向该 URL 暴露你的 IP,内容本身不会外传。
数据敏感、或者公司内网不允许访问外网时,这就是选桌面版而不是网页版的理由。
安装 draw.io 桌面版的 3 种方式
Windows 没有管理员权限?选对安装包就行
Windows 上发布三种安装包,对应不同的权限场景:
installer.exe(NSIS):装到 Program Files,整机生效,需要管理员权限.msi:装到当前用户目录,不需要管理员权限no-installer.exe:绿色版,解压即用,不注册文件类型关联
另外还有 Microsoft Store 的 APPX 版本,同样是按用户安装、无需管理员。没有管理员权限的机器直接选 MSI 或绿色版即可。
从源码跑起来:两条命令
想跟进开发版或者做二次构建的话,需要 Node.js 22.12 以上环境:
git clone --recursive https://gitcode.com/GitHub_Trending/dr/drawio-desktop克隆时必须带--recursive,因为编辑器本体是一个 git 子模块(位于drawio/目录),缺了它项目打不开。之后在项目根目录执行npm install,再npm start就能启动应用,加DRAWIO_ENV=dev会顺带打开 DevTools 方便调试。
界面三块区域:图形库、画布、属性面板
对着上面那张截图看,界面就是三块:
- 左侧图形库:顶部是形状搜索框,往下是 General 等分类,底部的 "More Shapes..." 可以展开全部形状库。画流程图时最常用的矩形、菱形、箭头都能直接拖到画布上,不用翻菜单。
- 中间画布:支持无限缩放和平移。顶部工具栏放着缩放比例、撤销/重做、对齐、连线工具,画布底部还有页面标签页,一个文件可以包含多页图表。
- 右侧属性面板:选中元素后在这里调整字体大小、网格显示、背景,以及"连接箭头""连接点""自动保存"这些全局选项;Paper Size 区域可以切换 US-Letter 等纸张规格和横竖版式。
新建文件时可以直接套用内置模板(流程图、UML、网络拓扑等);常用模板存成个人模板后,以后新建时能直接复用,比每次从零拖图块快不少。快捷键和偏好类选项都在 Edit 和 Extras 菜单里。
导出格式:界面导出和最快的批量转换
界面里导出
文件菜单里选 Export As,可选 PNG、SVG、PDF、JPEG、XML、HTML,导出对话框里能设边距、缩放、是否透明背景。日常单图导出走这条路就够了。
命令行批量转换(⚡ 最快)
这是桌面版对工程团队最实用的一块:安装好的 draw.io 本身就是一个 CLI 工具。比如把一个目录里的图表全部递归转成透明底 PNG,一条命令:
drawio -x -r --format png --transparent ./diagrams其他高频选项:--all-pages把多页图表完整导出为 PDF,--border 10四周加 10 像素留白,--scale 2输出两倍尺寸,--theme dark生成深色背景。输入不限于 .drawio 文件——Visio 的 .vsdx、.csv、Mermaid 的 .mmd 文件都能直接导入转换。完整参数定义在src/main/args.js,运行drawio -h可查看全部帮助。
常见问题 ❓
设置和本地缓存在哪?
本地存储与会话数据放在系统用户目录下:
- macOS:
~/Library/Application Support/draw.io - Windows:
C:\Users\<用户名>\AppData\Roaming\draw.io\
应用自身的偏好设置通过 electron-store 持久化,也在同一目录里,迁移或清理数据时认准这里。
怎么关掉启动时的更新检查?
设置环境变量DRAWIO_DISABLE_UPDATE=true,或者启动时追加--disable-update参数。集中管理的部署场景常用这个;Flatpak 版本则会自行关闭更新。
能改代码自己构建吗?
项目是 Apache 2.0 许可,fork 之后可以构建自己的未签名版本:设置DRAWIO_UNSIGNED=true跳过签名和公证。完整步骤见官方文档 doc/BUILDING_FOR_PERSONAL_USE.md。需要说明的是,官方仓库不接受外部 PR,自改版本仅供个人使用,更新方式也变成了"拉取 → 重新构建 → 重装"。
macOS 用户的小福利
在 Finder 里对 .drawio 文件按空格键,Quick Look 扩展会直接渲染出图表预览,不用打开整个应用就能看一眼内容,评审文档时比较省事。
【免费下载链接】drawio-desktopOfficial electron build of draw.io项目地址: https://gitcode.com/GitHub_Trending/dr/drawio-desktop
创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考