Draw.io 图表生成技能
让 AI 助手直接生成原生 .drawio 图表文件，并可导出 PNG/SVG/PDF 或生成浏览器编辑链接，无需任何 MCP 配置。
证据显示：技能仅在本地生成 .drawio 文件，导出依赖本地 draw.io Desktop CLI，README 有专门的数据驻留章节说明图表不出本机；url 模式为选择性加入且数据在 URL #fragment 中。未发现 least privilege 之外的副作用或敏感数据处理问题。扣分项：无显式用户确认步骤，会自动执行 open/xdg-open/cmd.exe start 打开文件或浏览器，url 模式向 app.diagrams.net 硬编码发起出站请求（README 已披露），回滚仅为删除生成文件、未明示。
证据显示：文档内部自洽，含 CLI 检测、无 CLI 时的 XML/URL 回退、详细的 Troubleshooting 表（含已知 Mermaid→PNG 崩溃及两步规避）和多平台命令。扣分项：静态审查无法执行验证，技能本身无测试覆盖，依赖 draw.io Desktop 版本（--layout/.mmd 需新版本），失败反馈质量依赖文档而非运行时校验，故按静态上限计 9。
证据显示：适用图型、输出格式、无 CLI 回退、WSL2/Windows/macOS/Linux 环境适配均明确，边界说明充分。扣分项：description 使用 Always use 的宽泛触发，可能过度触发（例如纯文本 ASCII 图请求也会命中）；Mermaid/XML 参考通过 raw.githubusercontent.com 拉取，中国大陆网络可达性存疑，url 模式依赖 app.diagrams.net，核心功能在受限网络下可能降级。
证据显示：文档分层良好（管线→分支→参考→故障排查），命名约定、文件命名规则、已知限制披露清楚，Apache-2.0 许可明确，check-skill-sync CI 保证三份 SKILL.md 字节一致，维护方为 JGraph（版权署名）。扣分项：SKILL.md 本身无版本号或 changelog，共享参考文件按分支 main 拉取导致内容随时间漂移、非固定版本，发布者未经注册表验证（仅作披露不扣额外分）。
证据显示：产出为原生可编辑 .drawio 及嵌入 XML 的 PNG/SVG/PDF，多路径（Mermaid/XML/URL）与替代方案比较清楚，边际价值论据充分。扣分项：静态审查无法验证实际导出质量与命令成功执行，输出正确性、布局效果均未获得独立复现，按静态上限内从紧计 6。
证据显示：有主材料（SKILL.md、README、LICENSE）、CI 同步检查工作流，以及工具服务器侧的测试文件佐证仓库整体工程实践。扣分项：测试均针对 mcp-tool-server/shared 模块而非本技能的关键路径（Mermaid 转换、ELK 布局、导出），无第三方执行证据，故不超过静态上限 5。
- url 模式会把完整图表嵌入发送到 app.diagrams.net 的 URL（虽在 #fragment 中），且该端点硬编码不可替换；对数据出境敏感的环境应使用默认 .drawio 输出或本地 Desktop 导出。
- Mermaid/XML 参考文件从 raw.githubusercontent.com 拉取，中国大陆网络可能不可达或不稳定；建议用户预先缓存参考文件。
- Mermaid 转换、ELK 布局和 PNG/SVG/PDF 导出均需安装 draw.io Desktop 且版本较新；旧版本会静默缺失功能，技能已提供 XML 回退但仍需用户注意。
- description 触发条件很宽泛（Always use），可能在不合适场景被误触发；静态审查未执行任何命令，实际导出效果需用户自行验证。
- 发布者未经 FollowSkills 注册表验证；SKILL.md 无版本号与变更记录，参考内容随 main 分支漂移。
这个 Skill 能做什么，适合哪些场景？
这是官方 draw.io 仓库中面向 Claude Code 与 Codex CLI 的插件技能，位于 plugins/claude-code/skills/drawio。它以两种方式编写图表：优先使用 Mermaid（由 draw.io 桌面版 CLI 转换并自动布局），或直接编写 mxGraphModel XML（无需 CLI）。所有产物都是原生 .drawio 文件，随后可按需导出为嵌入了图表 XML 的 PNG/SVG/PDF（导出文件仍可在 draw.io 中重新编辑），或生成打开 app.diagrams.net 的浏览器 URL。XML 图表还可通过 ELK 预设或自定义 JSON 自动布局。无桌面 CLI 时可退回到 XML 方案，仅交付 .drawio 文件或 URL。
读取用户请求中的图表类型与输出格式偏好；将 Mermaid 写入 .mmd 文件并用 drawio CLI 转换为 .drawio（随后删除 .mmd），或直接生成 mxGraphModel XML；可用 --layout 运行 ELK 预设（verticalFlow、horizontalFlow、verticalTree、horizontalTree、radialTree、organic）、libavoid 正交连线或自定义布局 JSON；用 -x -f png/svg/pdf -e 导出并嵌入图表 XML；用 Node.js 内置 zlib 生成 app.diagrams.net 的 #create= URL 并调用 open/xdg-open/cmd.exe 打开；跨 macOS、Linux、Windows、WSL2 定位 draw.io CLI 与打开文件；最后打开产物或打印绝对路径/URL。
- 开发者在 Claude Code 中需要快速生成登录流程图或数据库 ER 图并保存为可编辑的 .drawio 文件
- 架构师需要 AWS/Azure 等特定形状库的架构图，并以 XML + AWS 形状直接编写后导出 PDF
- 没有安装 draw.io 桌面版的用户，希望得到一个可在浏览器 app.diagrams.net 中打开编辑的图表链接
- 需要整理手写 XML 坐标的用户，用 --layout verticalFlow 或 organic 让 ELK 自动排布节点
- 写文档的工程师想为 README 导出嵌入 XML 的 SVG，导出文件仍可在 draw.io 中继续编辑
- WSL2 用户按技能内置的 .url 临时文件方案在 Windows 浏览器中打开图表链接
这个 Skill 有哪些优点和局限？
- 产物是原生 .drawio / 嵌入 XML 的 PNG/SVG/PDF，导出文件仍可在 draw.io 中编辑
- Mermaid + 自动布局优先，避免手写 XML 坐标；XML 路线无需任何 CLI 也可工作
- 覆盖 macOS、Linux、Windows 原生与 WSL2 的 CLI 定位和打开命令，含已知坑（cmd.exe 会吞掉 # 片段）的排查表
- 数据驻留清晰：默认流程全部本地执行，不调用云端栅格化服务
- 由 draw.io 官方 jgraph 组织维护，共享 XML/Mermaid 参考文档为单一事实来源
- 完整功能（Mermaid 转换、ELK 布局、PNG/SVG/PDF 导出）依赖安装 draw.io 桌面版
- 当前 draw.io Desktop 中直接从 .mmd 导出 PNG 会崩溃，必须走两步转换路径
- url 模式硬编码指向 app.diagrams.net，无法自托管替代，且超大图表可能超出浏览器 URL 长度限制
- jpg 导出无嵌入 XML，导出后不可再编辑
- 仓库描述与 topics 字段为空；README 未提供该技能单独的测试或平台验证证据
如何安装这个 Skill？
在 Claude Code 中从本仓库的插件市场安装（来自 README，针对整个 drawio 插件集合）：
/plugin marketplace add jgraph/drawio-mcp
/plugin install drawio@drawio
或从本地克隆加载：claude --plugin-dir ./plugins/claude-code。Codex CLI：codex plugin marketplace add jgraph/drawio-mcp 然后 codex plugin add drawio@drawio。可选：安装 draw.io 桌面版以启用 Mermaid 转换、ELK 布局与图片导出。
如何使用这个 Skill？
直接用自然语言请求即可，例如："用 Mermaid 画一个用户登录的流程图" 或 "/drawio:drawio png login flow"。不带格式时生成并打开 .drawio 文件；指定 png/svg/pdf 时通过桌面 CLI 导出；指定 url 时生成 app.diagrams.net 链接并在本地保留 .drawio 副本。Mermaid 图表标签会匹配用户的语言。
这个 Skill 与同类方案有什么区别？
同一仓库还提供 MCP App Server（在聊天中内嵌渲染，托管于 mcp.draw.io，会把图表发送到服务器）、MCP Tool Server（npm 包 @drawio/mcp，在浏览器打开 draw.io 编辑器）以及无需安装的项目说明方案。本技能与它们的不同在于：不需要 MCP 配置、默认全程本地、产物为本地 .drawio 文件与可编辑导出，但缺少聊天内嵌预览。