一：简介
随着AI的兴起，Markdown是一种重要的载体用于AI的输入和输出，对于Markdown中支持的图标语法我们要能达到看的懂。
1.1 什么是 Mermaid？
Mermaid 是一个基于 JavaScript 的图表绘制工具，可以通过简单的文本语法创建各种图表，直接在 Markdown 中渲染。
1.2 优点
- 纯文本 - 易于版本控制
- 跨平台 - 大多数 Markdown 平台都支持
- 易维护 - 修改方便
- 可读性强 - 即使不看渲染结果也能理解
1.3 基本用法
在 Markdown 中使用 Mermaid，需要用 mermaid 代码块，%%表示注释，使用A、B、C、...来给每个节点起标识符ID，节点的形状是由后面的图形表示的，如 { } 表示判断， [ ] 表示方形节点，( )表示圆角方形，(( )) 表示正圆形， | | 表示条件值。
```mermaid
graph TD
%% 这是一条注释
A[开始] --> B{判断}
B -->|是| C[执行操作]
B -->|否| D[结束]
```1.3.1 流程图方向
T(Top) 、B(Bottom)、L(Left)、R(Right)：
- graph TD - 从上到下
- graph LR - 从左到右
- graph RL - 从右到左
- graph BT - 从下到上
1.3.2 节点形状
\]：长方形、( ) ：圆角长方形、(( ))：正圆、{ }：判断、\[/ /\]：平行四边形、\[\\ \]：反平行四边形 ```mermaid graph LR A[方形] B(圆角方形) C((圆形)) D{菱形} E[/平行四边形/] F[\反平行四边形
```
1.3.3 连接线样式
--> 表示实线实心箭头。
-.-> 表示虚线实心箭头。
```mermaid
graph LR
%% 创建示例节点
A[起点] --> B[终点]
%% 创建其他示例节点对
C[起点] --- D[终点]
E[起点] -.-> F[终点]
G[起点] ==> H[终点]
I[起点] -- 文本 --> J[终点]
K[起点] -->|文本| L[终点]
```
二：支持的图表类型
1. 流程图 (Flowchart)
```mermaid
graph TD
A[起床] --> B{是否周末?}
B -->|是| C[继续睡觉]
B -->|否| D[去上班]
D --> E[工作]
```
2. 时序图 (Sequence Diagram)
```mermaid
sequenceDiagram
participant 用户
participant 服务器
participant 数据库
用户->>服务器: 登录请求
服务器->>数据库: 验证用户
数据库-->>服务器: 验证结果
服务器-->>用户: 登录成功
```
3. 状态图 (State Diagram)
```mermaid
stateDiagram-v2
[*] --> 待机
待机 --> 运行: 启动
运行 --> 暂停: 暂停按钮
暂停 --> 运行: 继续按钮
运行 --> 待机: 停止
暂停 --> 待机: 停止
```
4. 类图 (Class Diagram)
```mermaid
classDiagram
class Animal {
+String name
+void eat()
+void sleep()
}
class Dog {
+void bark()
}
class Cat {
+void meow()
}
Animal <|-- Dog
Animal <|-- Cat
```
5. 饼图 (Pie Chart)
6. 甘特图 (Gantt Chart)
