Customize X-Axis Range and Labels

[christiansakai]

Hi, is it possible to have the X Axis to be configured in this way:
- First level is showing Day and Date
- Second level is showing the hours and minutes
- Range to be from some date X, from 4:30PM CST, to date Y 4:30PM CST

Such that when a data is given to the chart, the data that has start time before the lower bound of the date will be cut off, but only displayed partially.

[jakub.j]

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

It is possible to create to levels of xAxis using xAxis.linkedTo, to set the range you can use min and max properties.

I prepared a demo to show you how to create this kind of xAxis.

Demo: http://jsfiddle.net/BlackLabel/kyp13rh0/

Let me know if you have any further questions!

Regards
Jakub

[christiansakai]

I tried this in a Gantt Chart and the Hour:Minute doesn't seem to be displaying anything.

Code: Select all

      {
        type: 'datetime',
        tickInterval: 3600 * 1000,
        min: range.from,
        max: range.to,
        lineWidth: 0,
        tickWidth: 0,
        labels: {
          formatter: function(): string {
            // @ts-ignore
            return Highcharts.dateFormat("%H:%M", this.value);
          }
        }
      },
      {
        type: 'datetime',
        linkedTo: 0,
        tickInterval: 24 * 3600 * 1000,
        datetimeLabelFormats: {
          day: '%a, %e. %b'
        }
      },

[jakub.j]

Hello,

Sorry, I haven't seen that you mean HIghcharts Gantt, I prepared another demo using it.
I set min and max to xAxis and navigator.xAxis by dateRange variable and use xAxis.dateTimeLabelFormats to format the labels.

Demo: https://jsfiddle.net/BlackLabel/2k95gL3u/
API: https://api.highcharts.com/gantt/xAxis. ... belFormats
https://api.highcharts.com/gantt/navigator.xAxis

Feel free to ask any further questions!

Regards
Jakub

[christiansakai]

Yeah this is what I need! Thank you!

[jakub.j]

You're welcome! In case of any further questions, feel free to contact us again.

Regards
Jakub