流程图一种可以将复杂的流程图形化的方式，可读性强，易于理解，很适合对于复杂的业务流程，算法流程，以及商业流程进行图形化展示。Mermaid是一套比较流行的用于生成流程图的JavaScript库，支持多种语言的流程图形式，包括甘特图、时序图、类图、状态图等等，而且Mermaid生成的流程图不用类似于visio等商业软件，则更加轻量、简单。
一、优点
1、Mermaid生成的流程图不用类似于visio等商业软件，则更加轻量、简单。
2、Mermaid支持的语言种类众多，可以满足几乎所有的流程图需求。
3、Mermaid生成的流程图可以直接以代码形式进行编辑，便于团队协作以及版本管理。
4、Mermaid可以配合Markdown等文本编辑器使用，提升文本可读性。
二、用法示例
下面以一个简单的甘特图为例，展示Mermaid的用法
<div class="mermaid"> gantt dateFormat YYYY-MM-DD title 项目计划表 section 设计 设计概念 :done, des1, 2020-01-01,2020-01-10 设计蓝图 :done, des2, 2020-01-11,2020-02-02 设计开发 :des3, 2020-02-03, 20d section 实施 概念验证 :crit, done, 2020-02-06,24h 系统开发 :active, 2020-02-07, 30d 系统集成和测试 :2020-03-10, 20d 系统发布 :2020-03-19, 5d section 维护与支持 用户培训 :2020-03-23, 1d 操作文档 :20d 支持和维护 :2020-04-08, 365d 任务清单:2022-01-01, 365d </div>
以上代码将会生成如下一个甘特图
gantt
dateFormat YYYY-MM-DD
title 项目计划表
section 设计
设计概念 :done, des1, 2020-01-01,2020-01-10
设计蓝图 :done, des2, 2020-01-11,2020-02-02
设计开发 :des3, 2020-02-03, 20d
section 实施
概念验证 :crit, done, 2020-02-06,24h
系统开发 :active, 2020-02-07, 30d
系统集成和测试 :2020-03-10, 20d
系统发布 :2020-03-19, 5d
section 维护与支持
用户培训 :2020-03-23, 1d
操作文档 :20d
支持和维护 :2020-04-08, 365d
任务清单:2022-01-01, 365d
原创文章，作者：NOROT，如若转载，请注明出处：https://www.506064.com/n/325560.html
微信扫一扫 
支付宝扫一扫 