今天了解到一款在 markdown 中使用的绘图工具，感觉还不错。
Mermaid 是一种用于绘制流程图、时序图、甘特图和类似图表的 JavaScript 库，它使用 Markdown 语言编写图表代码。Mermaid 可以在 web 系统中直接集成，也可以在 VSCode、Atom 编辑器等环境中使用插件使用。Mermaid 最大特点是简单易用，只需要使用一些简单的 Markdown 语法即可快速绘制出各种复杂的图表，而无需繁琐的手工设置。
举个例子
以下是使用 Mermaid 绘制一个简单流程图的示例代码：
graph TD; Start-->Input; Input-->Process; Process-->Output; Output-->End;
上述代码使用 Markdown 语法书写，用来描述一个简单的流程图。其中 graph TD 语句表示图表类型是一个有向图，其中 TD 表示从上到下的方向。这个流程图共有 5 个节点，分别是 Start、Input、Process、Output 和 End。箭头表示节点之间的连接关系，–> 表示有向连接，左侧节点指向右侧节点。每个节点之间需要使用分号分隔。绘制出的流程图如下所示：
mermaid 的入门教程
官方文档：首推官方文档，可以快速了解 mermaid 各种图表的语法和用法。官方文档中包含了大量的实例和详细的解释，可以帮助初学者快速上手。https://mermaid-js.github.io/mermaid/
CSDN 博客：CSDN 上有一篇“mermaid 简单易用的 Markdown 绘图库”博客，详细介绍了如何使用 mermaid 绘制各种图表。该博客还包含了大量的实例代码和效果展示，非常适合想要学习 mermaid 的初学者。https://blog.csdn.net/qq_23091073/article/details/108393727
有哪些markdown app 支持mermaid
我就试了这两个：
Typora - 一个可视化的 Markdown 编辑器，支持 mermaid 插图
VS Code - 一款广受欢迎的代码编辑器，支持 mermaid 插件和预览
在 VS Code 中预览 mermaid 流程图需要使用插件
以下是详细步骤：
- 打开 VS Code，进入插件商店。
- 搜索 “Markdown Preview Mermaid Support” 插件并安装。
- 新建一个 Markdown 文件，在文档中插入 mermaid 代码。
- 按下快捷键 “Ctrl+Shift+P”（Mac 上是 “⇧+ ⌘ + P”），调出命令面板。
- 在命令面板中输入 “Markdown Preview Mermaid: Open Preview” 并选择。
- 此时预览面板中将自动解析 mermaid，展示出流程图。
独立开发者社群： https://dev4myself.com/blog/indie-developer-app-growth-diary-planet-introduction