Markdown绘制流程图的方法

Markdown绘制流程图的方法

日期：2015/08/13
作者：Z.K.

用Markdown绘制流程图十分简单方便，下面以几个例子来介绍其使用方法

Example1闰年判断

在编辑器中输入如下代码，

```flow
st=>start: Start
i=>inputoutput: 输入年份n
cond1=>condition: n能否被4整除？
cond2=>condition: n能否被100整除？
cond3=>condition: n能否被400整除？
o1=>inputoutput: 输出非闰年
o2=>inputoutput: 输出非闰年
o3=>inputoutput: 输出闰年
o4=>inputoutput: 输出闰年
e=>end
st->i->cond1
cond1(no)->o1->e
cond1(yes)->cond2
cond2(no)->o3->e
cond2(yes)->cond3
cond3(yes)->o2->e
cond3(no)->o4->e
```

即可得到下面的流程图，其中start表示开始，condition表示条件判断，inputoutput表示输入输出，end表示结束。注意声明时，冒号后面必须加空格，如：st=>start: Start

Created with Raphaël 2.1.0 Start 输入年份n n能否被4整除？ n能否被100整除？ n能否被400整除？ 输出非闰年 End 输出闰年 输出闰年 输出非闰年 yes no yes no yes no

Example2子程序

在编辑器中插入代码

```flow
st=>start: start:>http://www.baidu.com
op1=>operation: 操作1
cond1=>condition: YES or NO?
sub=>subroutine: 子程序
e=>end

st->op1->cond1
cond1(yes)->e
cond1(no)->sub(right)->op1  
```

如上所示，subroutine表示子程序，sub(right)可定义连接点的位置，同时st=>start: start:>http://www.baidu.com 还可以在方块上插入超链接。

Created with Raphaël 2.1.0 http://www.baidu.com start http://www.baidu.com 操作1 YES or NO? End 子程序 yes no

Example3

在编辑器中插入代码

```flow
st=>start: Start|past:>http://www.baidu.com
e=>end:  Ende|future:>http://www.baidu.com
op1=>operation:  My Operation
op2=>operation:  Stuff|current
sub1=>subroutine:  My Subroutine|invalid
cond=>condition:  Yes or No|approved:>http://www.google.com
c2=>condition:  Good idea|rejected
io=>inputoutput:  catch something...|future
st->op1(right)->cond
cond(yes, right)->c2
cond(no)->sub1(left)->op1
c2(yes)->io->e
c2(no)->op2->e  
```

Created with Raphaël 2.1.0 http://www.baidu.com Start http://www.baidu.com My Operation http://www.google.com Yes or No http://www.google.com Good idea catch something... http://www.baidu.com Ende http://www.baidu.com Stuff My Subroutine yes no yes no