[Solved]-set Highstock xAxis range within options object-Highcharts

You can:

• use chart redraw event callback function and call setExtremes:

chart: {
    events: {
        redraw: function() {
            if (allowChartRedraw) {
                allowChartRedraw = false;
                this.xAxis[0].setExtremes(0, Math.random() * 3);
            }

            allowChartRedraw = true;
        }
    }
}

Live example: http://jsfiddle.net/BlackLabel/wvpnct9h/

API Reference: https://api.highcharts.com/highcharts/chart.events.redraw

• keep all of the options in a state and manipulate axis extremes by min and max properties:

componentDidMount() {
  this.setState({
    chartOptions: {
      series: [
        {
          data: [Math.random() * 3, Math.random() * 3, Math.random() * 3]
        }
      ],
      xAxis: {
        min: 0,
        max: Math.random() * 3
      }
    }
  });
}

Live demo: https://codesandbox.io/s/highcharts-react-demo-jo6nw

• get the chart reference and call setExtremes on the xAxis.

Docs: https://github.com/highcharts/highcharts-react#how-to-get-a-chart-instance