Mermaid: Suggestions for Gantt diagrams: milestones and % of completion

[CapitanPrimate]

First of all, thanks for your wonderful work!

I am using mermaid to generate Gantt diagrams, and I find it very useful. However, I'd like to suggest some functionalities that I think would make it even greater:

1. The ability to define milestones (a square diamond or the like), maybe with a ":milestone" label. Right now I am trying to simulate this using some CSS magic, but it doesn't look nice.
2. The ability to show the % of completion of a task in a different colour.
3. The ability to control the "today" line length via configuration parameters.

My workflow is: Export CSV from Microsoft Project → Convert CSV to mermaid format using a gawk script → Generate Gantt chart (usually in SVG format).

In order to clarify, I'm attaching an example. Completed tasks appear in gray, ongoing/future tasks appear in light blue, delayed tasks appear in light orange, % of completion appears in light red. Finally, my manually-made annotations appear as text with arrows, both in orange.

Thank you very much!

[tylerlong]

You suggestions are very good! We are currently doing major refactoring to the code, so no more new features will be added in the near term. Once the refactoring is done we will go through all of the good suggestions to make a todo list. :)

[CapitanPrimate]

Great! In the meanwhile, I'll keep doing some CSS magic and looking forward to hearing your news!

[zeigerpuppy]

I agree, some great ideas. Percent complete, milestones and critical path would make the gantt implementation complete. The syntax is nice and readable at the moment. Could I suggest something like the following for critical path:

       dateFormat  YYYY-MM-DD
       title Adding GANTT diagram functionality to mermaid

       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, crit2, 3d
       Future task in critical line        :crit, 5d
       Create tests for renderer           :2d
       Add to mermaid                      :crit6, 1d

       Paths
       des1 -[red]-> crit2
       crit2 -[red]-> crit6

[finkga]

I would love to have the features above, but one simple thing I'd like to see is the ability to start a task relative to the start date of another task. For example:

`gantt

...

section...
Task one: one, 2018-05-21, 5d
Task two: two, one + 3d, 15d
`

[sanj79]

Hi @knsv ,

I am looking forward to integrate Mermaid JS to generate Gantt chart for a requirement. But before doing that, I was wondering if it currently has the capability to add links between tasks, like say:

There are 4 tasks, Task 1, Task 2, Task 3, Task 4. Is it possible to add links between them to represent dependency like if start of Task 4 is dependent on the completion on Task1, then can we add arrow between Task 1 to Task 4 to represent that connection ?

Also, is there a drilldown feature available, like if Task 1 contains 10 other subtasks, then on click of Task 1, can I show the 10 subtasks in a separate chart or perhaps in the same chart in a drilldown manner ?

This is what I'm looking to implement.

[gesinn-it]

@sanj79 maybe better create a new issue, as your request has nothing to do with the original request to render "% complete" and "milestones".

[cpetry]

I would also like milestones! This idea is 1 year old. Something new on this topic?

[ymoisan]

I wonder if something like the "today line" that shows up on a Gantt that comprises $today could be easily generalized to an arbitrary date ? That way we could use a line ala "today" to specify arbitrary points in time that would cut across all sections of the Gantt. Close enough a milestone functionality for me. My 2 cents.

[gijswijs]

I've added a pull request for milestones. If anyone is interested, please have a look at it.

788

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[amoblin]

so now percentage of completion will be supported or not?

[sweihub]

The mermaid chart is awesome, even awesome with markdown, it's so intuitive, I am expecting the link (connection/arrow) between tasks, any plan? Thanks.