A Gantt chart is a type of bar chart, first developed by Karol Adamiecki in 1896, and independently by Henry Gantt in the 1910s, that illustrates a project schedule and the amount of time it would take for any one project to finish. Gantt charts illustrate number of days between the start and finish dates of the terminal elements and summary elements of a project.
A note to users
Gantt Charts will record each scheduled task as one continuous bar that extends from the left to the right. The x axis represents time and the y records the different tasks and the order in which they are to be completed.
It is important to remember that when a date, day, or collection of dates specific to a task are "excluded", the Gantt Chart will accomodate those changes by extending an equal number of day, towards the right, not by creating a gap inside the task.
However, if the excluded dates are between two tasks that are set to start consecutively, the excluded dates will be skipped graphically and left blank, and the following task will begin after the end of the excluded dates.
A Gantt chart is useful for tracking the amount of time it would take before a project is finished, but it can also be used to graphically represent "non-working days", with a few tweaks.
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 dateFormat YYYY-MM-DD title Adding GANTT diagram functionality section A section Completed task :done, des1, 2014-01-06,2014-01-08 Active task :active, des2, 2014-01-09, 3d Future task : des3, after des2, 5d Future task2 : des4, after des3, 5d section Critical tasks Completed task in the critical line :crit, done, 2014-01-06,24h Implement parser and jison :crit, done, after des1, 2d Create tests for parser :crit, active, 3d Future task in critical line :crit, 5d Create tests for renderer :2d Add :1d section Documentation Describe gantt syntax :active, a1, after des1, 3d Add gantt diagram to demo page :after a1 , 20h Add another diagram to demo page :doc1, after a1 , 48h section Last section Describe gantt syntax :after doc1, 3d Add gantt diagram to demo page :20h Add another diagram to demo page :48h
It is possible to set multiple dependencies separated by space:
gantt apple :a, 2017-07-20, 1w banana :crit, b, 2017-07-23, 1d cherry :active, c, after b a, 1d
title is an optional string to be displayed at the top of the Gantt chart to describe the chart as a whole.
You can divide the chart into various sections, for example to separate different parts of a project like development and documentation.
To do so, start a line with the
section keyword and give it a name. (Note that unlike with the title for the entire chart, this name is required.
dateFormat defines the format of the date input of your gantt elements. How these dates are represented in the rendered chart output are defined by
Input date format
The default input date format is
YYYY-MM-DD. You can define your custom
The following formating options are supported:
Input Example Description: YYYY 2014 4 digit year YY 14 2 digit year Q 1..4 Quarter of year. Sets month to first month in quarter. M MM 1..12 Month number MMM MMMM January..Dec Month name in locale set by moment.locale() D DD 1..31 Day of month Do 1st..31st Day of month with ordinal DDD DDDD 1..365 Day of year X 1410715640.579 Unix timestamp x 1410715640579 Unix ms timestamp H HH 0..23 24 hour time h hh 1..12 12 hour time used with a A. a A am pm Post or ante meridiem m mm 0..59 Minutes s ss 0..59 Seconds S 0..9 Tenths of a second SS 0..99 Hundreds of a second SSS 0..999 Thousandths of a second Z ZZ +12:00 Offset from UTC as +-HH:mm, +-HHmm, or Z
More info in: http://momentjs.com/docs/#/parsing/string-format/
Output date format on the axis
The default output date format is YYYY-MM-DD. You can define your custom
2020-Q1 for the first quarter of the year 2020.
The following formating strings are supported:
%a - abbreviated weekday name. %A - full weekday name. %b - abbreviated month name. %B - full month name. %c - date and time, as "%a %b %e %H:%M:%S %Y". %d - zero-padded day of the month as a decimal number [01,31]. %e - space-padded day of the month as a decimal number [ 1,31]; equivalent to %_d. %H - hour (24-hour clock) as a decimal number [00,23]. %I - hour (12-hour clock) as a decimal number [01,12]. %j - day of the year as a decimal number [001,366]. %m - month as a decimal number [01,12]. %M - minute as a decimal number [00,59]. %L - milliseconds as a decimal number [000, 999]. %p - either AM or PM. %S - second as a decimal number [00,61]. %U - week number of the year (Sunday as the first day of the week) as a decimal number [00,53]. %w - weekday as a decimal number [0(Sunday),6]. %W - week number of the year (Monday as the first day of the week) as a decimal number [00,53]. %x - date, as "%m/%d/%Y". %X - time, as "%H:%M:%S". %y - year without century as a decimal number [00,99]. %Y - year with century as a decimal number. %Z - time zone offset, such as "-0700". %% - a literal "%" character.
More info in: https://github.com/mbostock/d3/wiki/Time-Formatting
Comments can be entered within a gantt chart, which will be ignored by the parser. Comments need to be on their own line, and must be prefaced with
%% (double percent signs). Any text after the start of the comment to the next newline will be treated as a comment, including any diagram syntax
gantt title A Gantt Diagram %% this is a comment 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
You can style or hide the marker for the current date. To style it, add a value for the
To hide the marker, set