Snap to month in highchart stock navigator - highcharts

Question

I've got a chart that where allow the user to view the data grouped by day, week, or month. The problem is that if you use the navigator the month columns grow and shrink as the navigator moves or is resized. If the user moves the navigator to the middle of a month, the column graph above shows that that month is off by half. Is there a way to make the navigator be limited by monthly increments?

Answer 1

Only solution is to use afterSetExtremes() or setExtremes() and there update extremes to required ones.

Answer 2

I think this will work, edited to UTC date
I also wrote in a 1 second delay to avoid it triggering too much
events: {
afterSetExtremes: function (e) {
minFirstDay = new Date(e.min);
minFirstDay = Date.UTC(minFirstDay.getFullYear(), minFirstDay.getMonth(), 1);
maxFirstDay = new Date(e.max);
maxFirstDay = Date.UTC(maxFirstDay.getFullYear(), maxFirstDay.getMonth(), 1);
setTimeout(function(){
if (e.min != minFirstDay || e.max != maxFirstDay) {
navChart.xAxis[0].setExtremes(minFirstDay, maxFirstDay);
console.log('date range updated');
};
}, 1000);
}
}