Highstock, True way of Get count of shown points after setExtreme (Zooming) - WITHOUT counting all data with MIN and MAX

Question

Sure there is a way to count all of points that shown after zooming or any changing view and do reaction for that.

My target is in Highchart 7.2.0 stockChart , IF "viewed points" x "radius of circles" , gone more than (>) "view-port pixels" , i just hide them, or doing something special with points, because some of them are Special and still should be shown.

so i need :

1. HOW GET : Count of points that JUST viewed now (WITHOUT PUTTING A "FOR" TO ALL OF DATA's)

(I just think if there is no true way for it, it is better to i count svg objects instead of : counting all of my data and using isInside with min and max )

2. The Best Events for : " afterSetExtremes " and " events :{ redraw :" [Solved i think]

              events: {
                afterSetExtremes: function(event) {
                      console.log(event.min);
                      console.log(event.max);
                  }
              }

3. How i turn them off [Solved i think]

                    if (chart.userOptions.plotOptions.line.marker.enabled) {
                        chart.userOptions.plotOptions.line.marker.enabled=false;
                        chart.update({
                            plotOptions: {
                                marker: {
                                    enabled:false
                                }
                            }
                        });
                    }

4. If there is automatic way like "amchart" options that i just ask " marker : { enabled: true " (when no problem) and " marker : { enabled: false " when it is tight. [Solved i think]

Solved by this:

        plotOptions: {
            series: {
                marker: {
                    enabled:undefined,
                    enabledThreshold: 4,
                    symbol: 'circle',
                    radius: 4,
                },
            }
        }

It was like this :

marker: {enabled: true , enabledThreshold: 0, (By Default)

Should be :

marker: {enabled: undefined , enabledThreshold: 4 , (More than Zero)

Got help from here : https://stackoverflow.com/a/54417034/7514010

Answer 1

The easiest way is to loop through the data and check isInside point property or point position. As an alternative you can overwrite translate method and count the number of visible points in the existing loop:

var counter;

(function(H) {
    H.Series.prototype.translate = function() {
        ...

        counter = 0;
        // Translate each point
        for (i = 0; i < dataLength; i++) {
            ...
            point.isInside =
                plotY !== undefined &&
                plotY >= 0 &&
                plotY <= yAxis.len && // #3519
                plotX >= 0 &&
                plotX <= xAxis.len;

            // CHANGE

            if (point.isInside) {
                counter++;
            }

            // CHANGE

            ...
        }
        series.closestPointRangePx = closestPointRangePx;
        H.fireEvent(this, 'afterTranslate');
    }

})(Highcharts)

Live demo: http://jsfiddle.net/BlackLabel/yx1cj0at/

Docs: https://www.highcharts.com/docs/extending-highcharts

Answer 2

It answered by @ppotaczek here in the third comment by this link jsfiddle.net/BlackLabel/j1tLfaxu and also in GitHub issues : https://github.com/highcharts/highcharts/issues/12017

If need to get count of points that just viewed now (by using afterSetExtremes or redraw or render events) :

    chart: {
        events: {
            render: function() {
                console.log(this.series[0].points.length)
            }
        }
    },

• processedXData can be used too instead of points
• points object have enough options like isInside :

this.series[0].points[0].isInsdie.

Because it is possible the first or last point be not shown and just affect the lines in line chart or in other type of chart be not shown because zooming in Y too.

and for just calculation where the extreme started you may need :

this.series[0].cropStart

and comparing that with your main data.