ChartPoint.State

Syntax

State: String;

Description

The State property determines state of the chart data series point.

Comments

Use JSON or the setState method to set the property value, and the getState method to get the property value.

Available values:

Normal. Data series point in a normal state (default).
Hover. Hovered data series point.

Example

To execute the example, the HTML page must contain the Chart component named chart (see Example of Creating a Stacked Histogram). Link the first point of the chart second series to other points of this series, and then change its state:

// Shows hovered series points
function printHoveredElements() {
    console.log("Hovered points of data series:");
    for (var i in chart.getSeries()) {
        var serie = chart.getSeries()[i];
        for (var j in serie.getPoints()) {
            var point = serie.getPoints()[j];
            if (point.getState() == "Hover") {
                console.log(point.getId());
            }
        }
    }
}
// Get the second data series
var serie = chart.getSeries()[1];
// Get the first point in the series
var point = serie.getPoints()[0];
// Get other points of the series
var linkedPoints = serie.getPoints().slice(1, serie.getPoints().length);
// Link the poins to the first point of the data series
point.setLinkedPoints(linkedPoints);
// Toggle state of the series first point and all linked points
point.setState("Hover", true);
// Output all hovered points
printHoveredElements();

After executing the example not only the first point of the second series, but also all linked points become hovered. Appropriate information is shown in the browser console:

Hovered points of data series:

point0

point1

point2

point3

point4