已经在浏览器里让 AI 生成了图表代码,不想再手动复制粘贴的人。
点一下代码块旁的按钮(或右键菜单)就能打开图表,接着在编辑器里改和保存。

怎么把 AI 对话里的图表代码打开?
以前的做法是:复制代码、打开 draw.io、找到导入、粘贴。Draw.io Quick Launcher 把这几步变成一步——它会在支持的 AI 网站里认出 draw.io XML 或 Mermaid 代码,旁边加一个“Open in Draw.io”按钮(也可以用右键菜单),点一下就在 diagrams.net 里打开。
它只负责把现成的代码送进编辑器。想让 AI 从需求开始画图,可以配合 Bruce Drawio 一起用。
怎么用?
- 从仓库链接的 Chrome 应用商店 安装扩展。
- 在支持的 AI 网站里,让 AI 生成 draw.io XML 或 Mermaid 代码。
- 点代码块旁边的“Open in Draw.io”;或者选中代码,用右键菜单打开。
- 在编辑器里检查内容、调整布局,然后保存源文件或导出图片。
支持哪些网站?
ChatGPT、Claude、Gemini、DeepSeek、Perplexity,还有 Kimi、豆包等。这些网站一改版,就可能认不出代码块,具体以当前扩展版本为准。
按钮没出现的话,选中代码用右键菜单试试。还是打不开,欢迎把网站和扩展版本反馈给我。
图表内容是怎么传过去的?
点击打开后,扩展会把图表内容编码进 diagrams.net 链接里 # 后面的部分。这部分不会随普通网络请求发给服务器,但会被打开的网页在你的浏览器里读取。所以,如果图里有敏感内容,别把这个完整链接随便分享出去。
打开以后还要做什么?
看看节点、箭头方向、文字换行,以及 Mermaid 实际画出来的样子对不对。要长期修改的图,记得保存可编辑的源文件——图片适合展示,但替代不了源文件。
项目文档和注意事项
项目文档:项目 README
内容更新:。正文依据上方 README 的固定提交整理;内容更新日期不代表已核验最新版本。最新版本和安装要求请看项目仓库。
注意:AI 网站改版可能导致按钮不出现;能打开也不代表图表语法、业务关系或转换结果一定对。
