其他图表
状态图、甘特图、饼图、用户旅行图是 Mermaid 的低频但高价值的图表类型:状态图表达对象的状态流转,甘特图管理项目进度,饼图展示占比,用户旅行图描述体验流程。它们各有独立语法,按场景选用。本文是 Mermaid 的其他图表分册。
状态图
stateDiagram-v2 描述状态流转,[*] 表示开始/结束,--> 表示转移:
stateDiagram-v2
[*] --> Still
Still --> Moving
Moving --> Crash
Crash --> [*]选择用 <<choice>>,分叉/汇合用 <<fork>> / <<join>>,便签用 note right of 状态:
stateDiagram-v2
state if_state <<choice>>
[*] --> IsPositive
IsPositive --> if_state
if_state --> False: if n < 0
if_state --> True : if n >= 0甘特图
甘特图用 gantt 管理项目进度:section 分章节,任务格式 任务名 :状态, id, 开始时间, 时长:
| 元素 | 写法 | 说明 |
|---|---|---|
| 标题 | title 文字 | 可选 |
| 章节 | section 名称 | 必填,区分任务组 |
| 任务状态 | done / active / crit | 完成、进行中、关键路径 |
| 时间 | YYYY-MM-DD 或 after id | 绝对时间或相对前序任务 |
| 里程碑 | milestone, 日期, 0d | 时间点标记 |
| 排除周末 | excludes weekends | 自动跳过非工作日 |
饼图
pie 展示占比,数值为正数(最多两位小数),title 可选:
用户旅行图
journey 描述体验流程,任务格式 任务名: 分数: 参与者列表:
journey
title 一个工作日
section 上午
写代码: 5: 我
开会: 2: 我, 同事
section 下午
写文档: 3: 我ER 图(实体关系)
erDiagram 表达数据库表/实体间关系,关系符号语义:||--o{ 表示"一个对应零或多个"(|=一,o=零,{=多):
常用关系:||--|| 一对一、||--o{ 一对零或多、}o--|| 多对一、}o--o{ 多对零或多。数据库设计(见 建表)与领域建模(见 设计模式)常用。
Mindmap(思维导图)
mindmap 用缩进表达层级,适合头脑风暴与结构梳理(与 markmap 渲染为思维导图不同,mermaid 的 mindmap 是内置类型):
GitGraph(Git 分支图)
gitGraph 可视化分支与合并时间线,适合展示 Git 工作流(配合 版本控制):
跳出其他图表本身看:状态图与 流程图 都表达流转(状态驱动 vs 过程驱动),甘特图是项目管理专属,ER 图服务数据库设计,mindmap 管结构梳理,gitGraph 展示版本协作——先判断要表达什么,再选 Mermaid 中对应的图表类型。