Github也可以画流程图，怎么实现？

为了让大家能更便捷地使用图表，对项目架构进行条理性划分，GitHub 在前几天将绘图插件 Mermaid 集成进了 Markdown，并推出了一项「图表绘制」功能！

Mermaid 简介

Mermaid 是一款 JavaScript 图表工具，由开发者 Knut Sveidqvist 所负责维护，目前在 GitHub 已积累 42000 Star，在技术圈内受众颇广。

该工具的主要作用，是能直接通过文本，来动态调整与创建各种实用的图表。

GitHub：https://github.com/mermaid-js/mermaid

Mermaid 使用手册：https://mermaid-js.github.io/mermaid/

优势：以前，在项目文档中的图标，智能通过内嵌图片的方式实现，而在将 Mermaid 集成进 GitHub 之后，我们编写项目的 README 文件或其它 Markdown 文档时，便可以借助 mermaid 语法，在文档中轻松插入各类流程图、序列图、甘特图、类图、关系图等图表。

Mermaid 入门讲解

首先，我们需要在 Markdown 中使用 mermaid 声明，表示这是一段 mermaid 专属语法：

	```mermaid
	```

然后，用「flowchart TD」语法，表示这是一个从上（Top）到下（Down）的流程图（flowchart）。

最后一步，就是用「A–>B;」链式语法，来清晰表达各个节点之间的连接关系。

完整语法

	```mermaid
	flowchart TD;
	     A-->B;
	     A-->C;
	     B-->D;
	     C-->D;
	```

将上面这段语法，放到 GitHub 或使用 Markdown 编辑器 Typora 进行渲染，则可呈现流程图：

除了流程图之外，Mermaid 还提供了非常多种丰富的图表类型，你可以根据文档的不同内容，合理选择与之相对应的图表进行表述。