【Mermaid 语法详细教程 01】 流程图（Flowchart / graph）

说明

mermaid是一种解决文字图形转换的方案，用于在markdown标记语言中利用文本绘图，本文内容保证适合mermaid 8.8.3的内容，向上更新的内容不论。

本篇作为mermaid教程系列的第一篇，先介绍流程图（flowchart or graph）

流程图是mermaid最基础的应用内容，flowchart和graph在整体上类似，有区别的地方会单独提及。

文本框边缘形状 edges shape

流程图中，一个节点(nodes)的大概组成是

节点名称[节点展示文本]

节点展示文本的边缘形状取决于包括符号的类型，例子如下：

flowchart LR
在不做任何声明的情况下默认是矩形框

flowchart LR
A[矩形框] --> B(小圆角框) --> C{判断框} --> D([大圆角框]) --> E[[双线框]]--> F[(圆柱框)] --> G((圆框))

flowchart LR
H>标签框] --> I{
  {六角框}} -->J[/平行四边形框/] --> K[\平行四边形框\] --> L[/梯形框\] --> M[\倒梯形框/]

说明: LR为mermaid的图像朝向，关于图像朝向的内容可关注下面内容

注释 comments

flowchart LR
%% this is a comment A -- text --> B{node}
   A -- text --> B -- text2 --> C