axis.extremes.userMin & userMax undefined on redra

2019-06-11 04:16发布

问题:

I am trying to draw a pie chart on move of highstock slider.

At first move every thing is OK and I am getting values of highStock's axis.extremes.userMin & userMax as expected

Code

    var extremes = chart.xAxis[0].getExtremes();
    console.log(extremes);
    console.log(chart.xAxis[0]);
    console.log("userMin = " + extremes.userMin);
    console.log("userMax = " + extremes.userMax);

But once the pie chart is drawn I am getting above values as undefined as can be seen in console. What can be causing this Or how can I get the userMin/userMax?

jsFiddle Demo

回答1:

You appear to be overwriting your chart variable. Use a different variable for the pie and the stock chart.

In your case, you may as well use this inside the chart.events.redraw to point to the current (whose even is being handled) chart in your handler. Demo @ jsFiddle

redraw: function (event) {
    if (this.xAxis) {
        var extremes = this.xAxis[0].getExtremes();    
        console.log(extremes);
        console.log(chart.xAxis[0]);
        console.log("userMin = " + extremes.userMin);
        console.log("userMax = " + extremes.userMax);
        drawPie();

    }
}

A better or more correct way to handle your use case would be attaching the handler to the xAxis.events.setExtremes event rather than the chart.events.redraw event since you want to do something on the slide of the slider.

As given in the documentation, the event object contains the new min and max values as event.min and event.max and this represents the axis inside the handler.
This is how your code would look like

       xAxis: [
            {
            events: {
                setExtremes: function(event) {
                        console.log(this);
                        console.log("userMin = " + event.min);
                        console.log("userMax = " + event.max);
                        drawPie();                       
                }
            }}
        ],

Handling slider events @ jsFiddle



回答2:

Looks like you are calling console.log before assigning the data to the series.

Could you please try calling console.log after you already assigned data to series?

series : [{
            name : 'AAPL',
            data : data,
            tooltip: {
                valueDecimals: 2
            }
        }]

Mention this before you call console.log