This is my selection event handler in my code which I am for specific zoom timezones as you can see. What I am trying to achieve is to change the xAxis labels based on the zoom. Currently the following code does not work but I can not seem to find a solution to this problem online. Any thought?
Real question would be how can I alter highchart options through events. From the event parameter in the function I can access information but I can not change it.
I have two aproach, the first with changing inside event chart.redraw() will be called every time when chart is redrawn, for testing I added fired from a button.
redraw: function() {
let chart = this;
console.log(chart);
chart.xAxis[0].userMax = 8;
chart.xAxis[0].userMin = 2;
},
The next way is to update the axis object with a new set of userMax and userMin options.
chart.xAxis[0].update({
userMax: 8,
userMin: 2
}, true);
Live demo:
https://jsfiddle.net/BlackLabel/fcsd9hyo/
API References:
https://api.highcharts.com/highcharts/chart.events.redraw
https://api.highcharts.com/class-reference/Highcharts.Axis#update