X Axis Multiple Years

[m.cs]

Hi,

I have a gantt chart where the X Axis is dynamic and works almost always fine. The problem is when I have data from multiple years, both rows of the X Axis show the year which is strange.
How can I hide the top X Axis when the bottom X Axis is Years? Or if the bottom is Years, I show the top row but without any label?
Any solution would be fine.

Here is the Js Fiddle: https://jsfiddle.net/pbm87fc3/1/

Thank you.

[jakub.j]

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

These are the 2 possibilities:

#1 Set xAxis.visible to false for the 2nd xAxis - to hide the whole xAxis
Demo: https://jsfiddle.net/BlackLabel/t5sajkeb/

#2 Set xAxis.labels.format to an empty string - the row is shown without any labels
Demo: https://jsfiddle.net/BlackLabel/hb1xs24o/

Feel free to ask any further questions!
Kind regards
Jakub

[m.cs]

Hi Jakub,

Thank you for your answer but I didn't want to hide the top axis always. I just wanted to hide it when the bottom axis is years. Is this possible?

[jakub.j]

Hey!

Sorry, I misunderstood your question. I wrote custom logic in chart.events.render such that it toggles the visibility of the higher xAxis based on the labels' content of the lower one.

Demo: https://jsfiddle.net/BlackLabel/bzdhokcn/

Let me know if that was what you were looking for!
Best regards
Jakub

[m.cs]

Yes, that's it!
Thank you!