highchartshighcharts-gantt

Highcharts rangeselector navigation - start on the lowest date / value

On this official Highcharts demo https://www.highcharts.com/demo/gantt/with-navigation the display starts at the end enter image description here

What do I need to change, so the navigation range starts at the beginning like so? enter image description here

Solution

  • You can use setExtremes method in load event:

        chart: {
        events: {
            load: function() {
                const xAxis = this.xAxis[0];
                xAxis.setExtremes(xAxis.dataMin, xAxis.dataMin + xAxis.max - xAxis.min);
            }
        }
    }

    Live demo: https://jsfiddle.net/BlackLabel/8tk52zdw/

    API Reference: https://api.highcharts.com/class-reference/Highcharts.Axis#setExtremes