使用AI创建流程图和图表的 3 种简单方法
你可能已经尝试过使用 LLMs 生成图像，但你有没有想过用它们来创建 流程图和图表？这些可视化工具对于展示流程、工作流和系统架构至关重要。
通常，在在线工具上手动绘制图表可能会耗费大量时间。但你知道吗？你可以使用 LLMs 通过简单的文本描述自动生成 这些图表，从而节省时间和精力！
在本文中，我们将介绍 3 种简单的方法 来利用 LLMs 创建流程图和图表，并提供实际示例和可用的提示词。让我们开始吧！
方法 1：使用 LLMs 生成 Mermaid 代码
Mermaid.js 是一个基于 JavaScript 的简单制图工具，它允许你使用类似 Markdown 的语法创建 流程图、序列图等。
Mermaid 语法基础
graph TD/graph LR：定义图表方向（TD：自上而下，LR：从左到右）。- 节点定义：
A[文本]：普通节点。B{条件}：决策节点（菱形）。C[文本]：另一个普通节点。
- 连接方式：
A --> B：从 A 到 B 的方向箭头。B -- Yes --> C：带有条件标签的连接。
示例：用户登录流程
步骤 1：描述你的流程
提供清晰的描述，例如：
“创建一个用户登录流程的流程图。步骤包括：用户输入凭据，系统验证凭据，如果有效，则授予访问权限；如果无效，则显示错误信息。”
步骤 2：让 LLM 生成 Mermaid 代码
向 LLM（如 ChatGPT）提问，让它将你的描述转换为 Mermaid 语法。例如：
提示词（Prompt）：
“将以下流程转换为 Mermaid 流程图代码：[你的描述]”
LLM 可能会生成以下代码：
graph TD
A[用户输入凭据] --> B{系统验证凭据}
B -- 有效 --> C[授予访问权限]
B -- 无效 --> D[显示错误信息]
步骤 3：渲染图表
使用 Mermaid 兼容编辑器 可视化流程图，例如：
- Mermaid Live Editor
- VS Code + Mermaid 扩展
只需将代码粘贴到编辑器中，即可看到流程图！
方法 2：使用 LLMs 生成 PlantUML 代码
PlantUML 是一个广泛使用的 开源 UML 制图工具，支持 类图、序列图、活动图等。
PlantUML 语法基础
@startuml/@enduml：标记代码的开始和结束。actor：定义角色（如用户或外部系统）。participant：定义参与者（如对象或系统）。->：表示元素之间的交互。-->：表示返回消息或响应。
示例：在线购物流程
步骤 1：描述你的流程
“创建一个在线购物流程的序列图。步骤包括：用户添加商品到购物车，系统更新购物车，用户结账，系统处理付款，订单确认。”
步骤 2：让 LLM 生成 PlantUML 代码
提示词（Prompt）：
“将以下流程转换为 PlantUML 语法：[你的描述]”
LLM 可能会生成以下代码：
@startuml
actor 用户
participant "购物系统" as 系统
用户 -> 系统: 添加商品到购物车
系统 --> 用户: 购物车已更新
用户 -> 系统: 结账
系统 -> 系统: 处理付款
系统 --> 用户: 订单已确认
@enduml
步骤 3：渲染图表
使用 PlantUML 兼容编辑器 可视化流程图，例如：
- PlantText
- VS Code + PlantUML 扩展
只需粘贴代码，即可生成 UML 图表！
方法 3：使用 LLMs 生成 Graphviz DOT 代码
Graphviz 是一个强大的图形可视化软件，使用 DOT 语言 来描述图表。它支持 流程图、网络图、层次结构等。
Graphviz DOT 语法基础
digraph：表示有向图（即边具有方向）。->：定义节点之间的关系。[label="..."]：为边添加标签。A [shape=box]：自定义节点或边的属性。
示例：决策流程
步骤 1：描述你的流程
“创建一个决策流程的流程图。步骤包括：开始，分析数据，如果数据有效，则继续；如果无效，则重试。”
步骤 2：让 LLM 生成 DOT 代码
提示词（Prompt）：
“将以下流程转换为 Graphviz DOT 代码：[你的描述]”
LLM 可能会生成以下代码：
digraph DecisionMaking {
Start -> AnalyzeData
AnalyzeData -> Proceed [label="有效"]
AnalyzeData -> Retry [label="无效"]
}
步骤 3：渲染图表
使用 Graphviz 兼容编辑器 可视化流程图，例如：
- WebGraphviz
- VS Code + Graphviz 扩展
粘贴代码，即可生成决策流程图！
提升图表创建效率的小贴士
✅ 提供详细描述：描述越清晰，LLM 生成的代码越准确。
✅ 不断优化：可以手动调整代码，优化图表结构。
✅ 结合多种工具：Mermaid 适合快速绘制，Graphviz 适合复杂结构。
✅ 自动化生成：可结合 Python 脚本自动生成图表，提高工作效率。
无论你选择 Mermaid、PlantUML 还是 Graphviz DOT，这些方法都能让制图变得更快、更简单、更高效！
快来尝试这些工具，找到最适合你的工作流吧！