Need to call an API with min and max X values on Click of rangeselector Buttons - highcharts

Question

I want to make an API call on Click of RangeSelector Buttons in High stock. I am aware of the fact that there is a click event in RangeSelector but the problem is the event passed to that does not contain the min and max values of the graph. And I need these two values for making an API call. I am also aware that we can use afterSetExtremes here but the problem with that is it is triggered multiple times even when the button is not clicked. Below are some part of my code. Can anybody tell how can I get Xmin and Xmax in the click event?
const zoomButtons = [
{
type: 'minute',
count: 5,
text: '5min',
events:{
click: onClickOfRangeSelector
}
}]
function onClickOfRangeSelector(e) {
console.log(this);
console.log(e);// need to make an API call here
}

Answer 1

You can refer to a chart variable, please check the below code:
var chart = Highcharts.stockChart('container', {
...,
rangeSelector: {
buttons: [{
type: 'minute',
count: 5,
text: '5min',
events: {
click: function(a, b, c) {
var min = chart.xAxis[0].max - this._range,
max = chart.xAxis[0].max;
console.log(min, max);
}
}
}]
}
});
Live demo: http://jsfiddle.net/BlackLabel/x1gc38nd/
API Reference: https://api.highcharts.com/highstock/rangeSelector.buttons.events