gantt 甘特图

Mermaid - 图1

  • title，甘特图的标题
  • dateFormat：时间的格式
  • section：区块

一个甘特图可以有多个 section，每个 section 可以有多个任务。

定义一个任务：

  1. <任务描述> : <任务状态>,<任务命名>,<依赖关系>,<时间>,
  • 任务描述：直观描述任务做什么；
  • 任务状态：当前任务的状态，默认待完成，其他可选枚举：
    • active：进行中
    • done：已完成
    • crit：重要任务
  • 任务命名：相当于给任务取个变量名，例如 t1；
  • 依赖关系：指定任务之间的依赖关系，例如 after t1 表示在 t1 任务做完之后；
  • 时间：表示任务的时间范围，可以指定起止时间，有几种方式：
    • 2020-01-01 2020-01-04，表示从 1 号到 4 号；
    • 2020-01-01，3d，表示从 1-1 号开始，花费 3 天时间；
    • 4d，表示花费 4 天；

sequenceDiagram 顺序图

用法：

  • sequenceDiagram，开头第一行指定为顺序图；
  • participant ，设置角色别名，比如 participant B as 业务方开发，便捷；
  • autonumber，开启自动记录步骤；
  • 消息语法
  • 备注（note）
    • 在流程右边做笔记：Note right of [Actor]: Note text
    • 在流程上做笔记：Note over [Actor]: Note text

消息

消息的语法：[Actor][Arrow][Actor]:Message text，具体有下面几种：

  1. sequenceDiagram
  3.   A -> B: 不带箭头的实线
  4.     A --> B: 不带箭头的虚线
  5.     A ->> B: 带箭头的实线
  6.     A -->> B: 带箭头的虚线
  7.     A -X B: 实线异步
  8.     A --X B: 虚线异步

笔记

  • 在流程右边做笔记：Note right of [Actor]: Note text
  • 在流程上做笔记：Note over [Actor]: Note text，如果有多个 Actor 用逗号隔开

实战

Mermaid - 图2

一个实例： Mermaid - 图3

资料