draw-io

draw-io 技能提供了一种自动化、程序化的方法来维护存储库中的可视化文档。此技能专为开发人员与架构师设计，支持直接通过代码进行 .drawio 图表的创建、编辑与质量保证，确保图表与技术架构保持一致。通过直接操作 XML 与基于 CLI 的导出流程，它免除了手动绘图的需要，非常适合需要进行版本控制并与源代码同步的 CI/CD 流程。

• 利用预提交钩子 (pre-commit hooks) 与专用 Shell 脚本，将 .drawio XML 文件自动转换为高分辨率 PNG。

• 通过直接修改元素的 mxGraphModel XML 结构、组与连接关系，执行精确的坐标式排版调整。

• 支持企业级设计规范，包含特定字体 (例如 Noto Sans JP)、箭头定位与间距规则。

• 具备进阶架构建模能力，支持情境图、系统图、组件图、部署图与时序图。

• 内置针对图表对象的标题、版本与作者追踪等元数据管理功能。

• 提供组件对齐、组容器边距计算与高对比无障碍标准的验证规则。

• 使用此技能来维护随着功能开发更新的技术文档、系统架构流程与数据流向图。

• 在进行手动调整时，请校对 XML 原始文件中的坐标；建议优先采用计算出的中心对齐以确保多组件图表的视觉一致性。

• 建议使用单向箭头，并在 XML 中定义明确的来源与目标点，以避免自动生成的 PNG 导出文件产生渲染歧义。

• 务必设置 defaultFontFamily 以确保演示幻灯片与文档导出时的跨平台视觉一致性。

• 遵循渐进式揭露原则，建立从高阶系统概览到细粒度时序图的阶层式图表。

• 预期的输入为原始 .drawio XML 文件；输出包含更新后的 XML 以及准备好用于网页或 PDF 的透明背景 PNG 素材。