用途：把关系、顺序、拓扑、状态等抽象信息做成比纯文字更易理解的视觉模型，并交付一个自包含的 HTML 文件。
主要能力：先确定读者要回答的问题，再选择图表形式，包括拓扑（组件与连接）、时序（按时间排列的消息）、流程（步骤、分支与交接）、状态（转换与条件）、层级（包含或归属）、时间线（随时间变化）、矩阵（重复关系）以及定量视图（强调量级）。渲染方式按信息与规模选择 HTML/CSS、SVG、Canvas 或 WebGL，不因“是图表”就默认用 SVG。
使用方式：直接调用该技能，产出单个 HTML 文件，必要 CSS 与 JavaScript 内联，无需构建步骤或外部服务。先保证标签、分组、方向与连接线可读，再考虑交互；需要比较状态或步骤时保持节点位置稳定；减少边交叉与歧义箭头；宽画布放入可平移或滚动区域；仅当记号不自明时使用图例。交互如排序、过滤、路径追踪、平移缩放或动画，只在有助于回答既定问题时加入，并保证覆盖层可关闭、控件可键盘操作、动效兼容 prefers-reduced-motion。若 design-artifact 可用，可读取其周边构图与视觉调性，但图表语法、标签可读性与关系表达优先于装饰。
验证：在宽窄两种宽度下检查标签碰撞、节点裁切、边路由、阅读顺序、键盘操作、溢出及每个交互状态。返回绝对路径、所选图表形式以及主要简化或假设。
限制：资料未提供具体收费、价格、平台支持范围或效果保证；未提供安装命令与代码示例。