可编辑图表

Draw.io Quick Launcher

Draw.io Quick Launcher 是浏览器扩展,可将支持的 AI 对话页面中的 draw.io XML 或 Mermaid 代码打开到 diagrams.net 中预览与编辑。

Bruce Van更新于 阅读 Markdown →
适合谁

已经在浏览器 AI 对话中生成图表代码,希望减少复制粘贴步骤的用户。

预期结果

通过代码块按钮或右键菜单打开图表,再在编辑器中修改和保存。

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

Draw.io Quick Launcher 在支持的 AI 网站中识别 draw.io XML 或 Mermaid 代码,并提供“Open in Draw.io”按钮或右键菜单。点击后在 diagrams.net 中打开图表。

它负责将已有代码带到编辑器;若需要从需求开始生成图表,可以配合 Bruce Drawio

如何使用?

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

支持哪些网站?

支持 ChatGPT、Claude、Gemini、DeepSeek、Perplexity,以及 Kimi、豆包等网站。平台页面更新可能影响代码块识别,适配情况以当前扩展版本为准。

自动按钮没有出现时,可以选中代码后使用右键菜单。如仍无法打开,请反馈站点与扩展版本。

图表内容如何传递?

点击打开后,扩展会把图表编码进 diagrams.net URL 的 Fragment,即 # 后的部分。该部分不随普通 HTTP 请求发送,但会由目标网页在浏览器中读取;不要把包含敏感图表的完整链接随意分享。

导入以后还要做什么?

检查节点、方向、文字换行与 Mermaid 的实际渲染结果。需要长期修改的图表应保留可编辑源文件,图片适合展示,但不能替代源文件。

项目文档与使用限制

项目文档:项目 README

内容更新:。最新版本与安装要求见项目仓库。

使用限制:支持的网站和按钮识别随页面结构变化;能打开代码不代表图表语法、业务关系或转换结果一定正确。

STAY CONNECTED

关注微信公众号

扫码关注公众号 BruceNotes

BruceNotes 微信公众号二维码

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