5.20231.904
5.20231.904

Toggle Series Visibility in FlexChart

The Series class has a visibility property that allows you to determine whether a series should be shown in the chart and in the legend, only in the legend, or completely hidden. FlexChart also has a built-in legend toggle feature that can be enabled by just setting a property.

The series visibility can be toggled using two methods:

  1. Clicking on legend entries: The chart sets the chart's option.legendToggle property to true, which toggles the visibility property of a series when its legend entry is clicked.
  2. Using checkboxes: When the checked state changed, it will set the visibility property of each series by the checked state.

Example using legendToggle:

myChart.legendToggle = true;

Example using checkboxes:

var myCheckbox = document.getElementById('myCheckbox');
addEventListener('click', function (e) {
        myChart.series[0].visibility = e.target.checked
            ? wijmo.chart.SeriesVisibility.Visible
            : wijmo.chart.SeriesVisibility.Legend;
    });

This example just shows a single checkbox click implementation for one series. You would want a checkbox for each series.