[Solved]-Enable all range selector's options in stock highcharts-Highcharts

you can:

a) set min property for an x-axis in a navigator:

  navigator: {
    xaxis: {
      min: currenttimestamp - 6 * 60 * 60 * 1000, // 6 hours
    }, 
    // adapttoupdateddata: false,
    ...
  }

live example: https://stackblitz.com/edit/js-m38td3?file=index.js

api reference: https://api.highcharts.com/highstock/navigator.xaxis

b) enable rangeselector.allbuttonsenabled property and use afterbtnclick highcharts event. the event aftersetextremes is not called if the extremes are the same as the current one (they are because of initial min and max restriction).

chart: {
  zoomtype: 'x',
  events: {
    load: function() {
      highcharts.addevent(
        this.rangeselector,
        'afterbtnclick',
        function() {
          const button = this.buttonoptions[this.selected];
          const chart = this.chart;

          aftersetextremes({
            target: {
              chart
            },
            min: chart.xaxis[0].datamax - button._range,
            max: chart.xaxis[0].datamax
          });
        });
    }
  }
}

live demo: https://stackblitz.com/edit/js-tuzuuz?file=chartoptions.js,index.js,index.html

docs: https://www.highcharts.com/docs/extending-highcharts/extending-highcharts