Skip to content

Gantt chart syntax

Gantt chart syntax allows for the creation of project timelines and schedules directly within Markdown-compatible environments that support the Mermaid diagramming library.^[600-developer-tools-obsidian-johnny-ob-037.md]

Syntax Structure

To render a Gantt chart, the code block must be initialized with the mermaid identifier followed immediately by the gantt keyword^[600-developer-tools-obsidian-johnny-ob-037.md]. The chart is organized into sections, which categorize the tasks (e.g., section Section)^[600-developer-tools-obsidian-johnny-ob-037.md].

Task entries are defined by a descriptive name, followed by a colon, and then a series of status and timing parameters^[600-developer-tools-obsidian-johnny-ob-037.md]. The general format for a task definition is:

TaskName :status, id, startDate, duration/endDate

Task States

Tasks can be assigned specific states to visually indicate their progress on the timeline^[600-developer-tools-obsidian-johnny-ob-037.md]:

  • done: Indicates a task that is completed.
  • active: Indicates a task that is currently in progress.
  • (Default): If no status is specified, the task appears as a standard bar without specific highlighting.

Timing and Dependencies

The syntax supports various methods for defining task duration and relationships^[600-developer-tools-obsidian-johnny-ob-037.md]:

  • Explicit Dates: Tasks can be defined using specific start and end dates (e.g., 2014-01-06,2014-01-08).
  • Duration: Instead of an end date, a duration value can be used (e.g., 3d for 3 days).
  • Dependencies: Tasks can be scheduled relative to other tasks using the after keyword followed by the predecessor's ID (e.g., after des1).

Example

The following code demonstrates a chart with sections, different task states, parallel tasks, and dependencies^[600-developer-tools-obsidian-johnny-ob-037.md]:

gantt
section Section
Completed :done,    des1, 2014-01-06,2014-01-08
Active        :active,  des2, 2014-01-07, 3d
Parallel 1   :         des3, after des1, 1d
Parallel 2   :         des4, after des1, 1d
Parallel 3   :         des5, after des3, 1d
Parallel 4   :         des6, after des4, 1d
  • [[Mermaid]]
  • [[Flowchart syntax]]

Sources

^[600-developer-tools-obsidian-johnny-ob-037.md]