Markdown+Flowchart流程图语法

Markdown中的flowchart流程图可以很方便地来自动生成流程图，让大家集中注意力与各元素间的逻辑，而减少排班带来的麻烦，废话不多说，我们开始吧！

---

语法介绍

首先要清楚，Flowchart流程图分为元素定义、连线两个组成部分：

1. 定义所有元素

利用关键字，为各元素取一个你喜欢的别名，常用的关键字如下：

• start 开始节点
  定义语句： s=>start: 系统初始化
  意为定义一个名字叫“s”的“start”元素，该元素显示的内容为“系统初始化”
  
• end 结束节点
  定义语句： e=>end: 测温结束
  意为定义一个名字叫“e”的“end”元素，该元素显示的内容为“测温结束”
  
• operation 操作节点
  定义语句： o1=>operation: 开始测温
  意为定义一个名字叫“o1”的“operation”元素，该元素显示的内容为“开始测温”
  
• condition 条件节点
  定义语句： c1=>condition: KEY按下？
  意为定义一个名字叫“c1”的“condition”元素，该元素显示的内容为“KEY按下?”
  
• inputoutput 输入或输出节点
  定义语句：io=>inputoutput: 输入
  意为定义一个名字叫“io”的“inputoutput”元素，该元素显示的内容为“输入”
  
• subroutine 子程序节点

2.连线：

用->将两个元素连接

3.附加语法

• 超链接：
  在定义元素时，用:>给某个元素添加超链接。下句让start元素链接至百度首页

s=>start: 系统初始化:>https://www.baidu.com/

---

实例演示

效果图

Created with Raphaël 2.2.0 系统初始化 输入 KEY按下？ 开始测温 LCD屏幕显示体温 体温正常？ 测温结束 蜂鸣器响起 yes no yes no

源代码

```mermaid
flowchat
s=>start: 系统初始化:>https://github.com/knsv/mermaid
io=>inputoutput: User Input
c1=>condition: KEY按下？
c2=>condition: 体温正常？
o1=>operation: 开始测温
o2=>operation: LCD屏幕显示体温
o3=>operation: 蜂鸣器响起
e=>end: 测温结束

s->c1(yes)->o1->o2->c2(yes)->e
c1(no)->c1
c2(no)->o3->e

其中最需要注意的是condition元素的用法，利用c1(yes)和c1(no)进行分支判断。最后感谢大家的阅读，若有语法扩充我会及时更新，也欢迎在评论区提出改进意见~