flowchart
MarkEditor风格的流程图语法
流程图的语法规则实际上是基于http://adrai.github.io/flowchart.js/实现的,只要申明语言类型为flow
即可。
但是我们认为原始插件的语法有些晦涩,所以在兼容原有语法的基础上,又重新进行了演绎,效果如下:
原始语法(示例)
mermaid
MarkEditor 也同样支持 mermaid 的语法。
注意: 不恰当的格式,会导致 mermaid 的渲染卡住整个 MarkEditor,要特别注意不要出现中文状态下的的某些字符,比如中文问号、中文括号。
graph TD
A[Christmas] -->|Get money| B(Go shopping)
B --> C{Let me think}
C -->|One| D[Laptop]
C -->|Two| E[iPhone]
C -->|Three| F[Car]
gantt
dateFormat YYYY-MM-DD
title Adding GANTT diagram functionality to mermaid
section A section
Completed task :done, des1, 2014-01-06,2014-01-08
Active task :active, des2, 2014-01-09, 3d
Future task : des3, after des2, 5d
Future task2 : des4, after des3, 5d
section Critical tasks
Completed task in the critical line :crit, done, 2014-01-06,24h
Implement parser and jison :crit, done, after des1, 2d
Create tests for parser :crit, active, 3d
Future task in critical line :crit, 5d
Create tests for renderer :2d
Add to mermaid :1d