Obsidian流程图插件怎么用?一次从安装到成图的完整记录

📅 2026/8/19 9:01:56
Obsidian流程图插件怎么用?一次从安装到成图的完整记录
Obsidian流程图插件怎么用一次从安装到成图的完整记录【免费下载链接】drawio-obsidianDraw.io plugin for obsidian.md项目地址: https://gitcode.com/gh_mirrors/dr/drawio-obsidian周五上午十点我盯着空白的周报文档只差一张架构图。打开专业绘图软件画完要导出、截图、再拖回笔记改一版就重来一遍。用 Obsidian 自带的方案画出来的图丑得拿不出手。后来我装了一个叫Diagrams的插件它把 Draw.io 的整套绘图能力直接搬进了 Obsidian——这正是很多人要找的那个 Obsidian流程图插件不切换应用、不导出文件、不重画图右键两下就能开工。这篇文章不打算堆功能清单而是把我从装插件到画出一张能用的图的全过程原样走一遍。你跟着做完今天下班前就能在自己的笔记里画出第一张图。装起来Obsidian流程图插件最快安装方法这个插件需要从源码编译整个过程大约三分钟两条命令。先克隆源码git clone https://gitcode.com/gh_mirrors/dr/drawio-obsidian cd drawio-obsidian再安装依赖并编译npm install npm run build第一条命令把插件源码拉到本地第二条安装依赖并生成 Obsidian 运行所需的main.js。如果你以后想研究它的实现TypeScript 源码都集中在src/目录构建配置在rollup.config.js层次很清晰。接下来打开 Obsidian依次进入设置 → 第三方插件 → 关闭安全模式 → 从文件夹安装选中刚才的插件目录然后启用列表里的Diagrams即可。有一点先提醒你插件在manifest.json里明确标注了isDesktopOnly目前只支持桌面端手机上的 Obsidian 暂时用不了。装好之后怎么确认生效在文件管理器的空白处右键如果出现了New diagram选项说明它已经接管了你的图表工作流。✅新建画布在 Obsidian 里创建新图表画图的第一步是有一块空白画布。Diagrams 给了三个入口记住任意一个就行编辑器右键在笔记正文里右键选 Insert new diagram文件区图标左侧文件面板顶部的图表小图标点一下即可文件夹右键在文件管理器里右键任意文件夹选 New diagram图1新建图表的三条入口右键菜单与顶部按钮均可触发第一次新建时Obsidian 会让你选择文件格式。这里说一个很多教程没讲透的事SVG 和 .drawio 到底怎么选SVG默认推荐纯文本格式浏览器能直接打开预览放进 Git 后能看清楚每次改了什么适合团队共享.drawio保留完整编辑信息相当于底稿适合日后拿到 Draw.io 原生环境继续精加工我的经验是协作场合选 SVG个人存档的复杂图用 .drawio各取所长。动手画图在笔记里拖出第一张架构图新建后会自动打开 Draw.io 编辑器界面跟网页版 draw.io 几乎一致主要记住三块区域左侧工具栏文本、矩形、椭圆、箭头、连接线等基础图形选中后拖到画布即可中间画布自由摆放元素支持框选、多选拖动、对齐右侧格式面板调填充色、边框粗细、字体、箭头样式等细节图2上方笔记通过双链嵌入图表下方为 Draw.io 编辑器保存后笔记即时更新画第一张图有个小技巧先别追求美观把方块和箭头按逻辑摆好全部完成后再用格式面板统一刷颜色和字体效率比边画边调高一倍。嵌入笔记一键把图表嵌进文档画完保存接下来是重头戏——把图嵌进笔记正文。这里用的是 Obsidian 标准的双链语法一行就够[[你的图表.svg]]保存后Obsidian 会把这张图渲染成可点击的预览。它和笔记是实时关联的回到编辑器改图切回笔记预览立刻同步不用重新截图也不用重新插入。这正是我愿意放弃外部画图软件工作流的核心原因——图和文字终于不再脱节。还有个隐藏收益因为走的是标准内链[[图表名]]会正常出现在反链面板里哪篇笔记引用了这张图一眼就能看到。二次修改点一下预览就能改图图表很少一次画完我平时改个三四版是常态。好在这个插件把改图的门槛也压到了最低文件管理器右键图表文件选 Edit diagram 直接进入编辑器笔记正文直接点击嵌入的图表预览同样会唤起编辑器图3右键已有图表文件选择 Edit diagram在原图上继续修改即可改完按CtrlS笔记里的预览立即更新。整个过程不需要重新导出、不需要二次嵌入反复迭代几乎没有额外摩擦。长期主义让图表进入版本管理如果你的笔记库放在 Git 仓库里很多 Obsidian 重度用户都会这么做SVG 格式还有一个隐藏福利图表也能被 diff。因为 SVG 是纯文本提交记录里可以直接看到这次改图动了哪些节点、加了哪个方块配合描述性的文件名比如支付流程-异步改造.svg而不是图1.svg团队 review 图表的改动会非常轻松。再配合一个专门存放图表的 Diagrams 文件夹一个清晰、可追溯、可协作的图表工作流就这么成型了。这套组合拳是外部画图软件给不了的。现在就去画第一张图回到开头那个周五的上午。装上插件之后我的周报架构图是这样完成的右键新建 → 拖方块连线 → 嵌进笔记 → 汇报前改了三版 →CtrlS同步预览 → 提交 Git。全程没离开 Obsidian前后不到二十分钟。如果你的笔记里也经常差一张图别犹豫——现在就克隆源码装好插件用上面任意一个入口新建一张空白画布拖上第一个方块。下次再需要画图的时候你大概会想不起来上一个画图软件叫什么名字了。【免费下载链接】drawio-obsidianDraw.io plugin for obsidian.md项目地址: https://gitcode.com/gh_mirrors/dr/drawio-obsidian创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考