Mermaid语法入门：15个简单例句助你快速上手210

Mermaid是一种基于文本的图表绘制工具，它使用简单的语法就能生成各种图表，包括流程图、序列图、甘特图、类图等等。其简洁易懂的语法使得即使没有编程经验的人也能轻松上手。本文将提供15个简单的Mermaid例句，帮助你快速掌握其基本用法，并在此基础上扩展理解。

1. 最简单的流程图：

graph TD
A[开始] --> B{判断};
B -- 是 --> C[结束];
B -- 否 --> D[步骤2];
D --> C;

这段代码绘制了一个简单的流程图，包含开始、判断、步骤2和结束四个节点，以及它们之间的流程关系。`graph TD`指定这是一个自上而下的流程图，`-->`表示流程方向，`{}`表示判断节点，`[]`表示普通节点。

2. 更复杂的流程图：

graph LR
A[起点] --> B(处理1);
B --> C{条件};
C -- 是 --> D[处理2];
C -- 否 --> E[处理3];
D --> F[终点];
E --> F;

这个例子在之前的基础上增加了更多的节点和分支，展示了如何处理更复杂的流程。`graph LR`指定这是一个自左向右的流程图。

3. 简单的序列图：

sequenceDiagram
participant 用户
participant 系统
用户->>系统: 登录请求
activate 系统
系统->>用户: 登录成功
deactivate 系统

这段代码绘制了一个简单的序列图，展示了用户和系统之间的交互过程。`participant`定义参与者，`->>`表示消息方向，`activate`和`deactivate`表示激活和停用。

4. 包含注释的序列图：

sequenceDiagram
participant Alice
participant Bob
Alice->>Bob: Hello Bob, how are you?
Note right of Bob: Bob thinks
Bob->>Alice: I am fine, thank you!

此例展示了如何在序列图中添加注释，`Note`用于添加旁注，解释流程。

5. 简单的甘特图：

gantt
dateFormat YYYY-MM-DD
title Adding GANTT diagram functionality to mermaid
excludes weekends
section Section
A task :a1, 2014-01-06, 3d
Another task :after a1 , 20d
section Another section
Task in secion2 :2014-01-12 , 12d

这段代码绘制了一个简单的甘特图，展示了任务的开始时间和持续时间。`dateFormat`定义日期格式，`title`定义标题，`excludes weekends`排除周末，`section`定义区块，`:`后定义任务名、开始时间和持续时间。

6. 类图示例：

classDiagram
class Animal {
-name: String
+eat()
}
class Dog extends Animal {
+bark()
}
class Cat extends Animal {
+meow()
}

此例展示了如何用Mermaid绘制类图，展示了类之间的继承关系和类成员。

接下来是更进一步的例子，展现Mermaid语法的更多细节和功能：

7. 流程图中的条件判断和子流程：

graph TD
A --> B;
B -- 条件1 --> C;
B -- 条件2 --> D;
subgraph "子流程"
D --> E;
E --> F;
end
C --> G;
F --> G;

8. 序列图中的循环：

sequenceDiagram
loop 循环三次
A->>B: 请求
B->>A: 响应
end

9. 甘特图中的里程碑：

gantt
dateFormat YYYY-MM-DD
title 甘特图
section Section
A task :a1, 2024-01-06, 3d
Milestone :after a1, 1d

10. 类图中的关联关系：