Mermaid图表写作指南：流程图、时序图、类图到甘特图

🧱 为什么选Mermaid？

纯文本描述，便于版本管理与协作，支持流程图、序列图、类图、状态图、ER图、甘特图等。

✍️ 常用语法速查

flowchart TD
  A[开始] --> B{条件?}
  B -->|是| C[处理1]
  B -->|否| D[处理2]
  C --> E[结束]
  D --> E

sequenceDiagram
  participant User
  participant API
  User->>API: 请求
  API-->>User: 响应

classDiagram
  class User {
    +id: string
    +name(): string
  }

🎯 最佳实践

1. 统一方向（TD/LR）与主题，保持可读性。
2. 大图拆分为子图；或用子图 subgraph。
3. 提前定义样式/类，避免重复。

🧰 导出与集成

• 在线编辑器导出 PNG/SVG 嵌入文档与Wiki。
• 前端可动态渲染：mermaid.initialize({ startOnLoad: true })。

🔗 相关工具

在线编写并实时预览Mermaid图表？试试 在线Mermaid图表编辑器，支持模板、暗黑模式与导出图片。