Excalidraw Diagram Generator
Create Excalidraw diagrams from text content with multiple output formats.
Output Modes
根据用户的触发词选择输出模式：
Workflow
- Detect output mode from trigger words (see Output Modes table above)
- Analyze content - identify concepts, relationships, hierarchy
- Choose diagram type (see Diagram Types below)
- Generate Excalidraw JSON (add animation order if Animated mode)
- Output in correct format based on mode
- Automatically save to current working directory
- Notify user with file path and usage instructions
Output Formats
Mode 1: Obsidian Format (Default)
严格按照以下结构输出，不得有任何修改：
关键要点：
- Frontmatter 必须包含
tags: [excalidraw] - 警告信息必须完整
- JSON 必须被
%%标记包围 - 不能使用
excalidraw-plugin: parsed以外的其他 frontmatter 设置 - 文件扩展名：
.md
Mode 2: Standard Excalidraw Format
直接输出纯 JSON 文件，可在 excalidraw.com 打开：
关键要点：
source使用https://excalidraw.com（不是 Obsidian 插件）- 纯 JSON，无 Markdown 包装
- 文件扩展名：
.excalidraw
Mode 3: Animated Excalidraw Format
与 Standard 格式相同，但每个元素添加 customData.animate 字段控制动画顺序：
动画顺序规则：
order: 动画播放顺序（1, 2, 3...），数字越小越先出现duration: 该元素的绘制时长（毫秒），默认 500- 相同
order的元素同时出现 - 建议顺序：标题 → 主要框架 → 连接线 → 细节文字
使用方法：
- 生成
.excalidraw文件 - 拖到 https://dai-shi.github.io/excalidraw-animate/
- 点击 Animate 预览，然后导出 SVG 或 WebM
文件扩展名：.excalidraw
Diagram Types & Selection Guide
选择合适的图表形式，以提升理解力与视觉吸引力。
Design Rules
Text & Format
- 所有文本元素必须使用
fontFamily: 5（Excalifont 手写字体） - 文本中的双引号替换规则：
"替换为『』 - 文本中的圆括号替换规则：
()替换为「」 - 字体大小规则（硬性下限，低于此值在正常缩放下不可读）：
- 标题：20-28px（最小 20px）
- 副标题：18-20px
- 正文/标签：16-18px（最小 16px）
- 次要注释：14px（仅限不重要的辅助说明，慎用）
- 绝对禁止低于 14px
- 行高：所有文本使用
lineHeight: 1.25 - 文字居中估算：独立文本元素没有自动居中，需手动计算 x 坐标：
- 估算文字宽度：
estimatedWidth = text.length * fontSize * 0.5（CJK 字符用* 1.0） - 居中公式：
x = centerX - estimatedWidth / 2 - 示例：文字 "Hello"（5字符, fontSize 20）居中于 x=300 →
estimatedWidth = 5 * 20 * 0.5 = 50→x = 300 - 25 = 275
- 估算文字宽度：
Layout & Design
- 画布范围：建议所有元素在 0-1200 x 0-800 区域内
- 最小形状尺寸：带文字的矩形/椭圆不小于 120x60px
- 元素间距：最小 20-30px 间距，防止重叠
- 层次清晰：使用不同颜色和形状区分不同层级的信息
- 图形元素：适当使用矩形框、圆形、箭头等元素来组织信息
- 禁止 Emoji：不要在图表文本中使用任何 Emoji 符号，如需视觉标记请使用简单图形（圆形、方形、箭头）或颜色区分
Color Palette
文字颜色（strokeColor for text）：
形状填充色（backgroundColor, fillStyle: "solid"）：
区域背景色（大矩形 + opacity: 30，用于分层图表）：
对比度规则：
- 白底上文字最浅不低于
#757575，否则不可读 - 浅色填充上用深色变体文字（如浅绿底用
#15803d，不用#22c55e） - 避免浅灰色文字（
#b0b0b0、#999）出现在白底上
参考：references/excalidraw-schema.md [blocked]
JSON Structure
Obsidian 模式：
Standard / Animated 模式：
Element Template
Each element requires these fields (do NOT add extra fields like frameId, index, versionNonce, rawText -- they may cause issues on excalidraw.com. boundElements must be null not [], updated must be 1 not timestamps):
strokeStyle values: "solid"（实线，默认）| "dashed"（虚线）| "dotted"（点线）。虚线适合表示可选路径、异步流、弱关联等。
Text elements add:
Animated 模式额外添加 customData 字段：
See references/excalidraw-schema.md [blocked] for all element types.
Additional Technical Requirements
Text Elements 处理
## Text Elements部分在 Markdown 中必须留空，仅用%%作为分隔符- Obsidian ExcaliDraw 插件会根据 JSON 数据自动填充文本元素
- 不需要手动列出所有文本内容
坐标与布局
- 坐标系统：左上角为原点 (0,0)
- 推荐范围：所有元素在 0-1200 x 0-800 像素范围内
- 元素 ID：每个元素需要唯一的
id（可以是字符串，如「title」「box1」等）
Required Fields for All Elements
IMPORTANT: Do NOT include frameId, index, versionNonce, or rawText fields. Use boundElements: null (not []), and updated: 1 (not timestamps).
Text-Specific Properties
文本元素 (type: "text") 需要额外属性（do NOT include rawText）：
appState 配置
files 字段
Common Mistakes to Avoid
- 文字偏移 — 独立 text 元素的
x是左边缘，不是中心。必须用居中公式手动计算，否则文字会偏到一边 - 元素重叠 — y 坐标相近的元素容易堆叠。放置新元素前检查与周围元素是否有至少 20px 间距
- 画布留白不足 — 内容不要贴着画布边缘。在四周留 50-80px 的 padding
- 标题没有居中于图表 — 标题应居中于下方图表的整体宽度，不是固定在 x=0
- 箭头标签溢出 — 长文字标签（如 "ATP + NADPH"）会超出短箭头。保持标签简短或加大箭头长度
- 对比度不够 — 浅色文字在白底上几乎不可见。文字颜色不低于
#757575，有色文字用深色变体 - 字号太小 — 低于 14px 在正常缩放下不可读，正文最小 16px
Implementation Notes
Auto-save & File Generation Workflow
当生成 Excalidraw 图表时，必须自动执行以下步骤：
1. 选择合适的图表类型
- 根据用户提供的内容特性，参考上方 「Diagram Types & Selection Guide」 表
- 分析内容的核心诉求，选择最合适的可视化形式
2. 生成有意义的文件名
根据输出模式选择文件扩展名：
- 优先使用中文以提高清晰度
3. 使用 Write 工具自动保存文件
- 保存位置：当前工作目录（自动检测环境变量）
- 完整路径：
{current_directory}/[filename].md - 这样可以实现灵活迁移，无需硬编码路径
4. 确保 Markdown 结构完全正确
必须按以下格式生成（不能有任何修改）：
5. JSON 数据要求
- 包含完整的 Excalidraw JSON 结构
- 所有文本元素使用
fontFamily: 5 - 文本中的
"替换为『』 - 文本中的
()替换为「」 - JSON 格式必须有效，通过语法检查
- 所有元素有唯一的
id - 包含
appState和files: {}字段
6. 用户反馈与确认
向用户报告：
- 图表已生成
- 精确的保存位置
- 如何在 Obsidian 中查看
- 图表的设计选择说明（选择了什么类型的图表、为什么）
- 是否需要调整或修改
Example Output Messages
Obsidian 模式：
Standard 模式：
Animated 模式：
