mermaidjs / mermaid-gitbook

Documentation has been moved to docs in https://github.com/mermaid-js/mermaid
https://mermaidjs.github.io
554 stars 225 forks source link

Feature Request - Format Date/Time Output #48

Open Heiko-san opened 5 years ago

Heiko-san commented 5 years ago

Actually you can perfectly use the gantt diagram to draw tasks on hours, minutes or even seconds base. This could make mermaid a powerful tool to easily visualize time trackings (like visualize a taskwarrior database).

https://mermaidjs.github.io/mermaid-live-editor/#/edit/eyJjb2RlIjoiZ2FudHRcbnRpdGxlIFRpbWUgVHJhY2tpbmdcbmRhdGVGb3JtYXQgIEhIOm06c1xuc2VjdGlvbiBNb25kYXlcbkEgdGFzayAgICAgICAgICAgOiBhMSwgMDk6MDA6MDAsIDA5OjMwOjAwXG5Bbm90aGVyIHRhc2sgICAgIDphZnRlciBhMSAgLCAyMG1cbnNlY3Rpb24gVHVlc2RheVxuVGFzayBpbiBzZWMgICAgICA6MDk6MDA6MzAgICwgMTJtXG5hbm90aGVyIHRhc2sgICAgICA6IDI0bSIsIm1lcm1haWQiOnsidGhlbWUiOiJkZWZhdWx0In19

However the scale at the bottom still only prints the date.

It would be helpful if the dateFormat field would be evaluated for the date/time output aswell, or if you had another outputFormat field for that.

justinrush commented 4 years ago

This would be really helpful - with longer gantts with a mix of long and short tasks, the bottom scale is unreadable. A separate field would be great so we can specify year-month-date as start/ends but show month-date on the output.

kut commented 4 years ago

It's not in the docs, but axisFormat ended up solving this for me. It uses a different formatting to dateFormat, as explained under "Scale" here: https://mermaid-js.github.io/mermaid/#/gantt?id=scale

Example:

gantt
    dateFormat   YYYY-MM-DD
    axisFormat   %b %Y
arvidj commented 6 months ago

@kut Here's a full example using axisFormat to solve the problem: