Table of Contents

About

The gantt component is a diagram component that permits to create a gantt diagram

Example

  • The markup
<gantt>
gantt
    title A Gantt Diagram
    dateFormat  YYYY-MM-DD
    section Section
    A task           :a1, 2014-01-01, 30d
    Another task     :after a1  , 20d
    section Another
    Task in sec      :2014-01-12  , 12d
    another task      : 24d
</gantt>
  • The output:
gantt title A Gantt Diagram dateFormat YYYY-MM-DD section Section A task :a1, 2014-01-01, 30d Another task :after a1 , 20d section Another Task in sec :2014-01-12 , 12d another task : 24d

Syntax

The syntax is based on the mermaid Gantt definition 

<gantt>
   ... Mermaid Gantt definition ...
</gantt>

Mermaid offers a live editor that you can use to validate and develop your diagrams.

This component is based on the mermaid component.