可编辑图表

Draw.io Quick Launcher

Draw.io Quick Launcher 是一个浏览器插件:AI 对话里出现 draw.io XML 或 Mermaid 代码时,一键在 diagrams.net 里打开,直接预览和修改。

更新于 阅读 Markdown →
适合谁

已经在浏览器里让 AI 生成了图表代码,不想再手动复制粘贴的人。

用完能得到

点一下代码块旁的按钮(或右键菜单)就能打开图表,接着在编辑器里改和保存。

夸克精选新插件列表中的 Draw.io Quick Launcher
夸克精选新插件列表中的 Draw.io Quick Launcher。站内留存截图,截图版本与拍摄日期未记录;当前界面以项目官方说明为准。点击图片查看大图。

怎么把 AI 对话里的图表代码打开?

以前的做法是:复制代码、打开 draw.io、找到导入、粘贴。Draw.io Quick Launcher 把这几步变成一步——它会在支持的 AI 网站里认出 draw.io XML 或 Mermaid 代码,旁边加一个“Open in Draw.io”按钮(也可以用右键菜单),点一下就在 diagrams.net 里打开。

它只负责把现成的代码送进编辑器。想让 AI 从需求开始画图,可以配合 Bruce Drawio 一起用。

怎么用?

  1. 从仓库链接的 Chrome 应用商店 安装扩展。
  2. 在支持的 AI 网站里,让 AI 生成 draw.io XML 或 Mermaid 代码。
  3. 点代码块旁边的“Open in Draw.io”;或者选中代码,用右键菜单打开。
  4. 在编辑器里检查内容、调整布局,然后保存源文件或导出图片。

支持哪些网站?

ChatGPT、Claude、Gemini、DeepSeek、Perplexity,还有 Kimi、豆包等。这些网站一改版,就可能认不出代码块,具体以当前扩展版本为准。

按钮没出现的话,选中代码用右键菜单试试。还是打不开,欢迎把网站和扩展版本反馈给我。

图表内容是怎么传过去的?

点击打开后,扩展会把图表内容编码进 diagrams.net 链接里 # 后面的部分。这部分不会随普通网络请求发给服务器,但会被打开的网页在你的浏览器里读取。所以,如果图里有敏感内容,别把这个完整链接随便分享出去。

打开以后还要做什么?

看看节点、箭头方向、文字换行,以及 Mermaid 实际画出来的样子对不对。要长期修改的图,记得保存可编辑的源文件——图片适合展示,但替代不了源文件。

项目文档和注意事项

项目文档:项目 README

内容更新:。正文依据上方 README 的固定提交整理;内容更新日期不代表已核验最新版本。最新版本和安装要求请看项目仓库。

注意:AI 网站改版可能导致按钮不出现;能打开也不代表图表语法、业务关系或转换结果一定对。

STAY CONNECTED

关注微信公众号

扫码关注公众号 BruceNotes

BruceNotes 微信公众号二维码

分享 AI 工具与使用方法,不定期更新。