避免特殊字符的错误
文字里用引号避免一些特殊字符的错误。比如矩形节点里有 () 时就无法渲染，所以加上引号。此后yf就指的是This is the (text) in the box
graph LR yf["This is the (text) in the box"]
效果图：
时序图
sequenceDiagram participant Alice participant Bob Alice->John: Hello John, how are you? loop Healthcheck John->John: Fight against hypochondria end Note right of John: Rational thoughts <br/>prevail... John-->Alice: Great! John->Bob: How about you? Bob-->John: Jolly good!
参与者顺序
如果不显示声明，参与者将根据第一次出现的顺序排列，如：
sequenceDiagram Alice->>John: Hello John, how are you? John-->>Alice: Great!
第一条语句出现了两个参与者角色，而在这条语句中，Alice 在 John 之前，所以图中也是这个顺序。如果不想根据第一次出现的顺序来排，可以主动声明以定义顺序：
sequenceDiagramDiagram participant John participant Alice Alice->>John: Hello John, how are you? John-->>Alice: Great!
角色别名
可以给角色写一个简短的别名以方便书写。
sequenceDiagram participant A as Alice participant J as John A->>J: Hello John, how are you? J->>A: Great!
消息
消息连线有六种样式。
有一个-是实线，两个-是虚线。
sequenceDiagram A->B: 无箭头实线 A-->B: 无箭头虚线(点线) A->>B: 有箭头实线 A-->>B: 有箭头实线 A-x B: 有箭头实线，加上叉 A--x B: 有箭头虚线，加上叉
flow图
甘特图
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 section Documentation Describe gantt syntax :active, a1, after des1, 3d Add gantt diagram to demo page :after a1 , 20h Add another diagram to demo page :doc1, after a1 , 48h section Last section Describe gantt syntax :after doc1, 3d Add gantt diagram to demo page : 20h Add another diagram to demo page : 48h
%% Example with slection of syntaxes 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 section Documentation Describe gantt syntax :active, a1, after des1, 3d Add gantt diagram to demo page :after a1 , 20h Add another diagram to demo page :doc1, after a1 , 48h section Last section Describe gantt syntax :after doc1, 3d Add gantt diagram to demo page : 20h Add another diagram to demo page : 48h
