How do I define initial start and end date for Highcharts Gantt?

Question

I need to set my Gantt chart to load on a specific range (eg. from today until 1 month in the future).

I can set the default zoom but couldn't find a way to set both start and end dates on load.

My code:

Highcharts.ganttChart('container', {
  rangeSelector: {
    enabled: true,
    selected: 0
  },
  yAxis: {
    uniqueNames: true,
    categories: ['A', 'B', 'C'],
  },
  series: [{
    type: 'line',
    zoneAxis: 'x',
    data: [{
      y: 0,
      x: Date.UTC(2022, 10, 18),
    }, {
      y: 0,
      x: Date.UTC(2022, 10, 25),
    }]
  }, {
    type: 'line',
    zoneAxis: 'x',
    data: [{
      y: 1,
      x: Date.UTC(2022, 10, 26),
    }, {
      y: 1,
      x: Date.UTC(2022, 10, 30),

    }]
  }, {
    type: 'line',
    zoneAxis: 'x',
    data: [{
      y: 2,
      x: Date.UTC(2021, 10, 26),
    }, {
      y: 2,
      x: Date.UTC(2023, 10, 30),

    }]
  }]
});

A fiddle

Answer 1

To set specific initial range on xAxis you can use xAxis.events.setExtremes.

  chart: {
    events: {
      load() {
        let chart = this;

        chart.xAxis[0].setExtremes(Date.UTC(2021, 10, 8), Date.UTC(2022, 11, 10))
      }
    }
  },

API: https://api.highcharts.com/gantt/xAxis.events.setExtremes

Live demo: https://jsfiddle.net/BlackLabel/sf3w15d6/