Mermaid #

┌─────────────────────────────────────────────────────────────┐
│                        Mermaid                               │
├─────────────────────────────────────────────────────────────┤
│  ┌─────────────┐  ┌─────────────┐  ┌─────────────┐         │
│  │  文本驱动    │  │  多种图表    │  │  易于维护   │         │
│  └─────────────┘  └─────────────┘  └─────────────┘         │
│  ┌─────────────┐  ┌─────────────┐  ┌─────────────┐         │
│  │  版本控制    │  │  跨平台      │  │  实时渲染   │         │
│  └─────────────┘  └─────────────┘  └─────────────┘         │
└─────────────────────────────────────────────────────────────┘

✅ 文本即图表
   - 用代码描述图表
   - 版本控制友好
   - 易于修改和维护

✅ 多种图表类型
   - 流程图 (Flowchart)
   - 时序图 (Sequence Diagram)
   - 甘特图 (Gantt Chart)
   - 类图 (Class Diagram)
   - 实体关系图 (ER Diagram)
   - 状态图 (State Diagram)
   - 饼图 (Pie Chart)

✅ 广泛支持
   - GitHub 原生支持
   - GitLab 原生支持
   - Markdown 文档集成
   - VS Code 插件

✅ 易于学习
   - 类 Markdown 语法
   - 丰富的文档
   - 活跃的社区

graph TD
    A[开始] --> B{判断}
    B -->|是| C[执行A]
    B -->|否| D[执行B]
    C --> E[结束]
    D --> E

sequenceDiagram
    participant 用户
    participant 服务器
    用户->>服务器: 发送请求
    服务器-->>用户: 返回响应

gantt
    title 项目计划
    section 开发
    需求分析 :a1, 2024-01-01, 7d
    编码实现 :a2, after a1, 14d

Mermaid 文档
├── 图表类型
│   ├── 实体关系图 (ER)
│   ├── Git 图
│   ├── 饼图
│   ├── 树图
│   └── XY 图
│
├── 基础图表
│   ├── 流程图
│   ├── 时序图
│   └── 甘特图
│
└── 高级用法
    ├── 样式定制
    └── 交互功能

graph TD
    A[方框] --> B{菱形}
    B --> C[圆角方框]

```mermaid
graph LR
    A --> B
```

入门阶段
├── 了解基本语法
├── 流程图绘制
└── 时序图绘制

进阶阶段
├── 甘特图
├── 类图
└── 实体关系图

高级阶段
├── 样式定制
├── 交互功能
└── 集成开发