Markdown 画流程图完全指南

Markdown 本身并不原生支持流程图，但借助 Mermaid 等扩展语法，你可以在支持该语法的编辑器或平台（如 Typora、Obsidian、GitHub + 插件、VS Code 等）中轻松绘制流程图。

1. 基础语法：使用 Mermaid

Mermaid 是一个流行的 Markdown 扩展，用于生成流程图、序列图、甘特图等。以下是一个简单的流程图示例：

```mermaid
graph TD
    A[开始] --> B{是否登录?}
    B -- 是 --> C[进入主页]
    B -- 否 --> D[跳转到登录页]
    C --> E[结束]
    D --> E
```

2. 流程图方向说明

• graph TD：从上到下（Top Down）
• graph LR：从左到右（Left Right）
• graph BT：从下到上
• graph RL：从右到左

3. 节点类型

Mermaid 支持多种节点样式：

```mermaid
graph LR
    A([圆角矩形]) --> B[[带边框的矩形]]
    B --> C{{菱形判断}}
    C --> D[(圆柱形数据库)]
    D --> E[(("圆形"))]
```

4. 注意事项

并非所有 Markdown 渲染器都支持 Mermaid。请确保你的编辑器或平台已启用相关插件。例如：

• Typora：需在偏好设置中开启 Mermaid 支持。
• VS Code：安装 Mermaid Preview 插件。
• GitHub：原生不支持，但可通过第三方工具预览。

5. 推荐工具

如果你需要将 Markdown 流程图导出为图片或嵌入文档，可使用在线 Mermaid 编辑器（如 mermaid.live）进行编辑和导出。