图表,包括各种流程图、时序图、甘特图,相比大段的文字,用于更强的视觉效果,拥有「一图胜千言」的效果;而 Markdown,则是一种简约的标记语言,可以用几个特殊符号实现快速排版。

你有没有想过,Markdown 还可以用来画图表?

用 Markdown 画图表,听上去有点像在炫技,其实这是一种很轻量的画图方式,绘制快速、易于修改;另一方面,大量免费工具对于「Markdown & 图表」的支持,也降低了我们「打字画图」的门槛。这篇文章里,我将和大家分享一些常用图表的绘制方法。

本文写作环境为 Windows 10 1809,所用编辑器为 Typora,版本 0.9.62 (beta)。以 Typora 为例,在 Typora「偏好设置 → Markdown 扩展语法」中打开「序列图、流程图和 Mermaid 选项」即可开启相关绘制功能。

为什么要用 Markdown 画图

诚然,市面上有强大的 Visio、Omni 家族,还有免费、在线的 ProcessOn、draw.io 等等优秀的流程图、时序图绘制工具,那我们为什么还要学习利用 Markdown 来绘制这些图表呢?

我主要青睐 Markdown 语言本身带来的特点——轻量和易修改

  1. 比起那些拖拽建立图标的工具,Markdown 更轻量,只靠打字就能制作图表。在我的想法意识流过程中突然出现「闪念」时,用 Markdown 可以快速抓住灵感。
  2. 用 Markdown 绘制图像,后期对图像进行更改的成本会很低。比如需要修改图中的几个错别字,那不必打开电脑、开启软件、找到图片源文件,而可以直接在 Markdown 文件中修改几处代码,在手机上也可以进行。

具体到工具方面,支持用 Markdown 画图的编辑器也不少,从免费大众的印象笔记、Typora,到经过配置的 Visual Studio Code 和 Sublime Text 都支持了时序图 Sequence、流程图 Flow Chart 等的绘制,有的甚至直接集成了 Mermaid 渲染引擎,可以让你创作更多个性图表。

接下来,我会具体介绍:如何利用简洁的 Markdown 语言,来高效的实现对时序图、流程图、甘特图等的绘制。