流程图编辑器

Mermaid 流程图编辑器说明

Mermaid 是一个基于文本的图表绘制工具,使用类 Markdown 语法描述图表,支持多种图表类型。只需编写简单的文本代码,即可自动生成专业的流程图、时序图、类图等,无需安装任何软件。

支持的图表类型

• 流程图 (Flowchart):描述业务流程、决策逻辑
• 时序图 (Sequence):展示系统间交互时序
• 类图 (Class):UML 类关系建模
• 甘特图 (Gantt):项目进度管理
• 饼图 (Pie):数据占比可视化
• ER图 (Entity Relationship):数据库关系建模

使用场景

技术文档编写、需求评审、系统架构设计、项目进度管理、数据库关系设计、教学演示等。

Mermaid 语法速查

• 流程图:graph TD; A-->B; B-->C
• 时序图:sequenceDiagram; A->>B: Hello
• 类图:classDiagram; Class01 <|-- Class02

常见问题

Mermaid 是什么?

Mermaid 是一个开源的文本绘图工具,用代码描述图表,无需拖拽,适合开发者和技术写作者快速生成各类图表。

怎么导出图片?

点击编辑器下方的"导出 SVG"或"导出 PNG"按钮即可下载对应格式的图片文件。

支持哪些图表类型?

目前支持流程图、时序图、类图、甘特图、饼图、ER图共 6 种图表类型。

语法写错了怎么办?

预览区会显示错误提示信息,根据提示修改代码即可。编辑器支持实时预览,修改后立即渲染。

可以在 Markdown 中使用 Mermaid 吗?

可以,GitHub、GitLab 等平台原生支持在 Markdown 中嵌入 Mermaid 代码块来渲染图表。

导出的图片清晰吗?

SVG 是矢量格式,支持无限缩放不失真;PNG 为 2 倍分辨率导出,适合文档和演示使用。