Statistics

• Overview
• Basics
• Chart
• Series
• Point

Overview

AnyChart's engine calculates a great number of values, which can be obtained with the help of the getStat() method. Here is the list of available values: anychart.enums.Statistics. Which value you can get depends on the chart type and on the object you call the method on (see this article).

Basics

To obtain statistical data from a chart, the getStat() method with a field name as a parameter is called. Available field names can be found in anychart.enums.Statistics – you can use their name or string representation:

var pointsCount = chart.getStat(anychart.enums.Statistics.DATA_PLOT_POINT_COUNT);
var bubbleMaxSize = chart.getStat("dataPlotBubbleMaxSize");

In the following sample, the getStat() method is used to obtain the maximum bubble size and number of points in the chart. The information is displayed in the title of the chart:

You can call getStat() on the instances of three types of classes: charts, series, and points. Further we will consider the basics of how the method works with each type.

Chart

You should call the getStat() method of a chart object if you need to get overall statistics on all the series of a multi-series chart or if the chart type does not suggest that there are more than one series.

The sample you see below demonstrates how the method allows to obtain the average Y-value of all the points in all the series of a chart (see the title):

totalAverage = chart.getStat("dataPlotYAverage");

In the next sample, the sum of all values in a pie chart is displayed (charts of this type always have only one series):

numberOfTrees = chart.getStat("sum");

Series

Sometimes it is necessary to call the getStat() method of an instance of the series class. Firstly, you may be interested only in one of all the data sets, secondly, the kind of statistics you can obtain depends on the type of a series.

The following sample is based on one of the samples from the previous section. Here, the average is obtained for each series separately, and two numbers are displayed in the title:

Please note that there are two ways to get a link to a series object instance: a link can be returned either by series constructor methods or by the getSeries() and getSeriesAt() methods of a chart:

maleAverage = maleMartians.getStat("seriesYAverage");
femaleAverage = chart.getSeriesAt(1).getStat("seriesYAverage");

Point

As a rule, to call getStat() on a point, one needs to use the so-called event listeners and text formatters. However, in some cases you can use the getPoint() method to get a link to a Point object, and invoke the getStat() method on it. We will demonstrate the both ways.

In the sample below, the title of the chart shows values of the latest points in both series. In addition, when a user selects a pair of points, a subtitle with information on these points appears:

The getPoint() method is used to get links to the latest points in two series, and then the getStat() method is called on them to get their values and create the title:

// get links to the latest points in both series
latestPointMaleMartians = maleMartians.getPoint(numberOfPoints - 1);
latestPointFemaleMartians = femaleMartians.getPoint(numberOfPoints - 1);

// get the values of the latest points from both series and use them in the title
mainTitleText = "The Height of Martians Today: Males — " +
latestPointMaleMartians.getStat("value") + ", Females — " +
latestPointFemaleMartians.getStat("value")

An event listener is used to listen to the pointsSelect event and get links to the selected points. The getStat() method is called on them to get their category name and values and to create the subtitle.

// listen to the pointsSelect event
chart.listen("pointsSelect", function(e){
  // get categoryName of the selected points
  selectedPointYear = e.point.getStat("categoryName");
  // begin creating a subtitle with the information on the selected points
  subtitleText = "<span style='font-size:12'>" + selectedPointYear + ": ";
  // loop through the array of the selected points
  for (var i = 0; i < e.points.length; i++) {
    // get the name of the series a selected point belongs to and the value of the point
    subtitleText += e.points[i].getSeries().name() + " — " + e.points[i].getStat("value") + ", ";
  }
  // remove the extra comma at the end of the subtitle and close the <span> tag
  subtitleText = subtitleText.slice(0, subtitleText.length - 2) + "</span>";
  // update the title with the subtitle
  chart.title(mainTitleText + "<br>" + subtitleText);
});