diagram-builder — 架构图与流程图绘制 Skill

diagram-builder — 架构图与流程图绘制 Skill 是什么

把组件、关系和流程转换为可在对话内渲染的 SVG/HTML 或可嵌入文档的 Mermaid 代码。

适用场景

适合系统架构、微服务、网络拓扑、泳道流程、时序、状态机、数据流和 ER 建模。

核心能力与工作机制

清单提供 680px SVG 规范、颜色与间距、marker 箭头、文字净空、分层布局、复用写法、自检清单和越界类型矩阵。

执行流程

先确认输出形态、图表类型和范围，读取 diagram 设计模块；整理节点和关系后布局，执行箭头与裁切自检，再通过 show_widget 渲染或交付 Mermaid。

输入与输出

需要图表类型、节点、层级、连接方向、重点关系和期望输出格式。输出内联 SVG/HTML、SVG 源码或 Mermaid 代码。

依赖、账号与权限

内联模式依赖 read_me 与 show_widget；Mermaid 模式需要兼容渲染器，复杂规则还需参考 arrow-text 指南。

副作用、限制与风险

信息密度过高会造成交叉线和不可读；SVG marker 或 viewBox 错误会导致箭头、文字和底部元素被裁切。通常只生成可视内容，不会修改系统；嵌入交互 HTML 时需额外审查代码。

不适用边界

明确不负责统计图、思维导图、3D、地图、PNG 直出或从未知系统反向工程。

失败处理与验收

出现压字或裁切时按坐标、净空、marker 和 viewBox 逐项修复；越界需求先给替代方案并等待确认。核对节点不超过合理密度、关系方向正确、文字不与线重叠，并在目标渲染器实际预览。

适合谁使用

适合架构师、产品经理、研发和技术文档作者。

来源、版本与许可

本条目依据 SkillHub 热门榜、发布者详情和版本 1.0.2 的完整 SKILL.md 整理，核验日期为 2026 年 9 月 21 日。完整 SKILL.md 未声明许可证，公开可下载不代表可以任意复制、修改或再分发。 SkillHub 当前两套安全扫描状态为 benign、benign；该状态只是平台信号，不能替代对脚本、凭据、网络请求、数据外送与后续版本的人工审查。

常见问题

1. diagram-builder — 架构图与流程图绘制 Skill 主要解决什么问题？

把组件、关系和流程转换为可在对话内渲染的 SVG/HTML 或可嵌入文档的 Mermaid 代码。适合系统架构、微服务、网络拓扑、泳道流程、时序、状态机、数据流和 ER 建模。是否采用它，应以实际任务边界和可核验材料为准，不要因为榜单热度而跳过来源审查。

2. 开始前需要准备什么？

需要图表类型、节点、层级、连接方向、重点关系和期望输出格式。准备阶段不要代替用户猜测关键事实；缺少会改变路线、费用或权限的输入时，应先补齐再执行。

3. 它怎样完成任务并交付结果？

先确认输出形态、图表类型和范围，读取 diagram 设计模块；整理节点和关系后布局，执行箭头与裁切自检，再通过 show_widget 渲染或交付 Mermaid。每个阶段都要保留输入、决策、输出和检查点，不能把计划、预览或排队状态描述成最终交付。

4. 需要哪些工具、账号或权限？

内联模式依赖 read_me 与 show_widget；Mermaid 模式需要兼容渲染器，复杂规则还需参考 arrow-text 指南。凭据应放在安全环境中，并按最小权限授权；账号、网络或本地依赖不满足时应明确停止条件。

5. 它会产生哪些外部操作或副作用？

通常只生成可视内容，不会修改系统；嵌入交互 HTML 时需额外审查代码。涉及外部写入、上传、发送、付费或持久配置时，应在实际动作前说明影响范围并取得相应确认。

6. 哪些情况不适合使用？

明确不负责统计图、思维导图、3D、地图、PNG 直出或从未知系统反向工程。超出来源明确能力、专业资质或授权范围时，应切换到更合适的工具或交给专业人员处理。

7. 失败或结果异常时怎样恢复？

出现压字或裁切时按坐标、净空、marker 和 viewBox 逐项修复；越界需求先给替代方案并等待确认。恢复时优先查询已有任务、日志或备份，避免无上限重试、重复扣费、重复发送或覆盖唯一原件。

8. 如何验收结果并控制风险？

核对节点不超过合理密度、关系方向正确、文字不与线重叠，并在目标渲染器实际预览。验收应基于真实文件、页面、任务终态或权威来源，并把未能实际检查的部分明确标记出来。