HighCharts: Accessing Zoomed Series Data

Question

If i zoom an HighStock multi series chart (using either the Navigator or the Range Selector), is there a way to fetch the point.y data only for the zoomed series?

For example, if I am showing the sales information for a period across multiple branches (each branch plotted as series), and if zoomed to a week, I would like to know the total of sales for the week across the branches. Does highstock provide access to the zoomed dataset?

Answer 1

You can check isInside flag on every point:

        redraw: function() {
            var sum = 0;

            Highcharts.each(this.series[0].points, function(point) {
                if (point.isInside) {
                    sum += point.y;
                }
            });
            console.log(sum)
        }

Live demo: http://jsfiddle.net/BlackLabel/7kmzhecy/

Answer 2

A very brute force approach to this is to loop over your data upon zooming and evaluate if it is visible. That is, is a given point within the range of the x-axis (and y-axis, if you allow zoom in that direction)?

chart: {
    events: {
        redraw: function() {
            sum = 0;
            xAxis = this.xAxis[0];
            // Loop over your series
            this.series[0].data.forEach(function(point) {
                // Add to sum if within x-axis visible range
                if(point.x >= xAxis.min && point.x <= xAxis.max) {
                    sum += point.y;
                }
                // If too large, stop summing
                if(point.x > xAxis.max) {
                    return;
                }
            });
            // Print sum
            console.log('Visible sum: '+sum);
        }
    }
}

See this JSFiddle demonstration of it in use.

You might evaluate xAxis.events.setExtremes, but it offers min and max values that might change after it takes effect, which might give some unexpected results.