===== mermaid ===== 项目地址:http://knsv.github.io/mermaid/ mermaid依赖于phantomjs PhantomJS是一个无界面的,可脚本编程的WebKit浏览器引擎。 ====mac 安装==== npm install -g mermaid brew install phantomjs ====使用==== term 输入 mermaid --help Usage: mermaid [options] ... file The mermaid description file to be rendered Options: -s --svg Output SVG instead of PNG (experimental) -p --png If SVG was selected, and you also want PNG, set this flag -o --outputDir Directory to save files, will be created automatically, defaults to `cwd` -O --outputSuffix Suffix to output filenames in front of '.svg' or '.png', defaults to '' -e --phantomPath Specify the path to the phantomjs executable -t --css Specify the path to a CSS file to be included when processing output -c --sequenceConfig Specify the path to the file with the configuration to be applied in the sequence diagram -g --ganttConfig Specify the path to the file with the configuration to be applied in the gantt diagram -h --help Show this message -v --verbose Show logging -w --width width of the generated png (number) --version Print version and quit ====时序图例子==== 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
prevail... John-->Alice: Great! John->Bob: How about you? alt good Bob-->John: Jolly good! else bad Bob-->John: Jolly bad! end
====流程图例子==== graph LR A-->B B-->C C-->|back|A D-.->|dot|C ====甘特图例子==== 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