| name | wj-excalidraw |
| description | 创建和编辑 Excalidraw 手绘风格技术示意图。当用户要求创建流程图、架构图、序列图、数据流图、思维导图、ER 图、关系图、示意图、diagram 或任何 .excalidraw 格式的可视化图表时使用。即使用户只说"画个图""画个流程""可视化一下""来个架构图""画个示意图"也应触发，默认输出 .excalidraw JSON 格式。不适用于信息图（infographic）或图片生成场景。 |
Excalidraw 技术示意图创建
生成手绘风格的技术示意图，输出 Excalidraw JSON 格式（.excalidraw 文件）。
文件结构
{
"type": "excalidraw",
"version": 2,
"source": "https://excalidraw.com",
"elements": [],
"appState": {
"viewBackgroundColor": "#ffffff",
"gridSize": null
},
"files": {}
}
兼容性硬规则（必须遵守）
- 禁止手写或伪造元素
index（order key）字段
该字段由 Excalidraw 内部维护，手工生成很容易触发：invalid order key: xx。
- 新建图时：所有元素都不要包含
index 字段。
- 编辑已有图时：不要新增/修改
index；如果出现 order key 错误，优先移除全文件元素的 index 字段后再保存。
fontFamily 默认必须为 5（ExcalFont）。只有用户明确要求其他字体时，才可使用 1/2/3。
元素通用属性
每个元素必须包含完整属性集（id, type, x, y, width, height 等 18 个字段）。完整模板和各类型详细参考见 element-reference.md。
元素类型
| 类型 | 用途 |
|---|
rectangle | 组件、模块、容器、流程框 |
ellipse | 状态节点、开始/结束点、数据对象 |
diamond | 条件判断、分支逻辑、决策节点 |
text | 标注说明、代码片段 |
arrow | 数据流向、调用关系 |
line | 连接线（无箭头）、生命线 |
freedraw | 手绘路径 |
frame | 分组/框架元素 |
项目配色方案（多彩低饱和度）
| 颜色系 | 边框色 | 背景色 | 语义 |
|---|
| 紫色系 | #7c3aed | #faf5ff | 核心概念、架构组件 |
| 绿色系 | #059669 | #ecfdf5 | 成功状态、正向流程、调度器 |
| 蓝色系 | #0ea5e9 | #f0f9ff | 数据容器、任务队列 |
| 青色系 | #0891b2 | #f0fdff | 次要元素、辅助功能 |
| 橙色系 | #ea580c | #fff7ed | 执行阶段、动作操作 |
| 红色系 | #dc2626 | #fef2f2 | 重要提示、优先级 |
| 黄色系 | #ca8a04 | #fefce8 | 特殊处理、工作循环 |
| 靛蓝系 | #6366f1 | #f5f3ff | 任务项、组件单元 |
- 文本颜色统一使用
#374151（gray-700）
- 边框宽度统一使用
strokeWidth: 2
- 关键路径用实线，次要连接用虚线
预设风格
提供 4 种预设：semantic-tech（默认技术图）、claude-docs（Claude 文档风格）、minimal-paper（论文配图）、warm-poster（概念海报）。
选择逻辑：用户提到 Claude/Anthropic 风格用 claude-docs；强调克制/论文感用 minimal-paper；强调海报/视觉用 warm-poster；其他技术图默认 semantic-tech。用户提供参考图时，预设只作为起点。
详细配色和布局参数见 presets.md。
文本元素
fontFamily：5 ExcalFont（默认且优先），2 Helvetica（仅用户明确要求），3 Cascadia（仅代码标注），1 Virgil（仅休闲风）fontSize：标题 28-36，节标题 24，标签 20，描述 16，注释 14
完整属性模板见 element-reference.md。
箭头元素
points 第一个点始终为 [0, 0]，后续点相对于元素 x/ywidth/height 必须匹配 points 的边界框- 箭头类型：
null, "arrow", "bar", "dot", "triangle"
完整属性模板见 element-reference.md。
绑定关系（双向维护）
- 形状绑定文本：形状的
boundElements 包含文本 ID，文本的 containerId 指向形状 ID
- 形状绑定箭头：形状的
boundElements 包含箭头 ID，箭头的 startBinding/endBinding 指向形状 ID
- 绑定必须双向声明，缺任何一侧都会导致连接失效
完整绑定示例见 element-reference.md。
样式属性速查
| 属性 | 值 |
|---|
fillStyle | "solid", "hachure", "cross-hatch" |
strokeWidth | 1（细），2（中），4（粗） |
strokeStyle | "solid", "dashed", "dotted" |
roughness | 0（精确），1（微手绘），2（草图） |
roundness | { "type": 3 } 圆角，null 直角 |
图表类型速查
| 类型 | 关键形状 | 流向 |
|---|
| 流程图 | rectangle + diamond | 上→下 |
| 序列图 | rectangle + line(dashed) + arrow | 左→右时间 |
| 架构图 | rectangle 分层 | 上→下 |
| 思维导图 | ellipse + line | 中心→外 |
| 数据流图 | ellipse + rectangle + arrow | 各种 |
| ERD | rectangle + line | 无固定 |
关键规则
id 和 seed 全局唯一，ID 使用描述性前缀（rect-、text-、arrow-、diamond-）- 元素间距保持 50-100px
- 文本默认
fontFamily: 5；未收到明确字体要求时不切换
- 实线箭头 = 主流程，虚线箭头 = 响应/异步
- 绑定关系必须双向维护（形状的 boundElements + 箭头/文本的 binding/containerId）
arrow/line 的 points[0] 必须是 [0, 0]，width/height 与 points 边界一致- 默认存放在
diagrams/ 目录，按模块分类；无该目录则根据项目结构决定
交付前自检
输出 .excalidraw 前检查: JSON 可解析、id 唯一、无 index 字段、arrow/line 的 points[0] === [0,0]、text 默认 fontFamily === 5、frameId 指向有效 frame。
若用户反馈 invalid order key: 删除全文件元素 index 字段，保持其余参数不变后重新保存。
参考文档
