Set axis extremes dynamically on drilldown

Question

I am working on a chart with two axes, which are proportional, i.e., the second axis maximum is exactly 13.5% of the first axis maximum.

I managed to do this with the callback functionnality of Highcharts, as @KacperMadej suggested me in this post:

function (chart) {
        chart.yAxis[1].update({
            max: chart.yAxis[0].getExtremes().max * 0.135
        });
 }

It works great, but when I drilldown on my chart, the second axis stays fixed to its values before drilldown. I can't find a way to affect this axis after the drilldown has been loaded.

Any idea on how I can get an after drilldown event on Highcharts ?

Here is what I have attempted so far:

chart: {
        alignTicks: false,
        events: {
            drilldown: function () {
                this.yAxis[1].update({
                    max: this.yAxis[0].getExtremes().max * 0.135
                });
            }
        }
}

This does not work at all as the second axis stays exactly the same before and after drilldown. See my JSFiddle here (Click on '2015' to drilldown).

Answer 1

You could call this function:

function(chart){
    chart.yAxis[1].update({max: chart.yAxis[0].getExtremes().max * 0.135});
}

in setTimeout in drilldown event. Zero milliseconds of delay seems to be an enough amount of time. Example: http://jsfiddle.net/zd5do0s7

(connected question: Set second axis in proportion of first axis)