Get wrong point.plotY position in Highcharts / Hig

问题:

I always get wrong point.plotY position when I click RangeSelector in Highstock.

Please see this fiddle.

I try to catch range change event in setExtremes: function (e). When I click 6m in rangeselector, in firebug console I print both last point object and point.plotY

You can see that the value of PlotY in the point object and the plotY is different. I also draw a path start from [chart.plotLeft + chart.plotWidth, chart.plotTop + point.plotY], it seems it does not match the last point of the series.

xAxis: {
                events: {

                    setExtremes: function (e) {
                        console.log('change');
                        $("#test").remove();

                        $(chart.series).each(function (i, serie) {
                            point = serie.data[serie.data.length - 1];
                            if (point) {
                                console.log(point);
                                console.log(point.plotY);
                                chart.renderer.path(['M', chart.plotLeft + chart.plotWidth, chart.plotTop + point.plotY, 'l', 1, 1])
                                    .attr({
                                    'stroke-width': 10,
                                    stroke: 'red',
                                    id: 'test'
                                })
                                    .add();
                            }

                        });
                    }

                }
            },

回答1:

I changed your code to use xAxis.events.afterSetExtremes instead of xAxis.events.setExtremes Also since you probably are referring to the last point in the view port, changed serie.data to serie.points

$(chart.series).each(function (i, serie) {
    point = serie.points[serie.points.length - 1];
    if (point) {
        console.log(point);
        console.log(point.plotY);
        chart.renderer.circle(chart.plotLeft + chart.plotWidth, chart.plotTop + point.plotY, 5)
            .attr({
            'stroke-width': 5,
            stroke: 'red',
            id: 'test'
        }).add();
    }
});

@jsFiddle