MrJohn
Posts: 1
Joined: Tue Feb 14, 2023 6:59 pm

Gantt Chart with 4 line x-axis Heading

Is it possible to have a 4 line x-axis header for a gantt chart like this?

Quarter
Month
G1, G2, G3, G4 where Gs are company defined time frame
P1, P2, P3, P4 where Ps are company defined time frame

Image below
Screenshot 2023-02-14 at 2.06.53 PM (2) copy.png
Screenshot 2023-02-14 at 2.06.53 PM (2) copy.png (38.28 KiB) Viewed 512 times
jedrzej.r
Posts: 725
Joined: Tue Jan 24, 2023 11:21 am

Re: Gantt Chart with 4 line x-axis Heading

Welcome to our forum and thanks for contacting us with your question!

Yes, it is possible to create such chart with 4 xAxis headings. For the Quarter and Months you just have to set tickInterval property to months and change labels to desired format. Take a look at this demo: https://jsfiddle.net/BlackLabel/p8nyL2d1/.

As for custom defined time frames for xAxis, you can check out this example: https://jsfiddle.net/BlackLabel/mfjt4gab/. You could use this code to customize it for your case, since I'm not aware what are the exact time frames and what are they supposed to indicate.

API:
https://api.highcharts.com/gantt/xAxis.labels.format
https://api.highcharts.com/gantt/xAxis.labels.formatter
https://api.highcharts.com/gantt/xAxis.units
https://api.highcharts.com/gantt/xAxis.tickInterval

I hope you will find it useful! In case of any other questions, feel free to contact us anytime.
Best regards!
Jędrzej Ruta
Highcharts Developer

Return to “Highcharts Gantt”