使用mermaid快速绘制流程图
基础语法
```mermaidflowchart TDA[开始] --> B{条件判断}B -->|是| C[执行操作1]B -->|否| D[执行操作2]C --> E[结束]D --> E```
常用元素
-
方向定义:
TD
:从上到下(Top-Down)LR
:从左到右(Left-Right)BT
:从下到上RL
:从右到左
-
节点:
- 矩形节点:
A[文本]
- 圆角矩形:
B(文本)
- 菱形(判断):
C{文本}
- 圆形:
D((文本))
- 矩形节点:
-
连接线:
- 实线箭头:
-->
- 虚线箭头:
-.->
- 无箭头线:
---
- 带文本的线:
-->|文本|
- 实线箭头:
示例
1. 简单流程
flowchart TDStart[开始] --> Input[输入数据]Input --> Process[处理数据]Process --> Output[输出结果]Output --> End[结束]
2. 条件分支
flowchart TDA[登录系统] --> B{密码正确?}B -->|是| C[进入主页]B -->|否| D[提示错误]C --> E[显示内容]D --> A
3. 子流程
flowchart TDA[主流程] --> B[[子流程1]]A --> C[[子流程2]]B --> D[合并结果]C --> D
注意
- 使用英文符号(如
[]
,{}
)。 - 节点名称需唯一。
- 支持 HTML 实体(如
工具支持
- 直接粘贴到支持 Mermaid 的编辑器(如 VS Code + 插件、Typora)。