SuperAPI AI 工具集

excalidraw-diagram

设计与创作

查看项目

更新于 10-15 21:38

技能介绍

用途:该技能在用户需要 Excalidraw 手绘风格白板图时使用,输出基于 JSON 的 Excalidraw 绘图格式,呈现手绘、白板质感,适合架构草图、概念图、头脑风暴和系统草图。与 Mermaid 的精确流程图不同,Excalidraw 用矩形、椭圆、箭头、文本、线条等几何图元在自由画布上布局。

主要能力:支持系统架构图、概念图/思维导图、用户流程/旅程、C4 风格草图、时序草图等类型。元素类型包括 rectangle、ellipse、diamond、arrow、line、text;箭头可带 startBinding/endBinding 绑定。文件结构为 type、version、source、elements、appState。输出格式包括独立 .excalidraw 文件、Obsidian 嵌入(.excalidraw.md,需 Zsolt Viczian 的 Excalidraw 插件)、动画 SVG(需插件导出命令,无法由纯 JSON 生成)。

使用方式:先确定图类型、组件、关系与布局,再规划位置与配色(蓝=前端、绿=后端、橙=外部、紫=数据、灰=基础设施),然后生成 JSON。独立文件保存为 DiagramName.excalidraw;Obsidian 中保存为 .excalidraw.md 并用 ![[DiagramName.excalidraw.md]] 嵌入;也可在 excalidraw.com 粘贴 JSON,或用 VS Code 的 Excalidraw 扩展渲染。

限制:每图建议 10-15 个元素,超过 20 个应拆分;每个箭头需有标签;ID 必须唯一且绑定元素必须存在;标签避免 CJK 等非 ASCII 字符;需使用 roughness: 1 保持手绘感。用户要精确流程图时应改用 mermaid-diagram,要结构化知识图谱时用 obsidian-canvas。