Home Forums Chart Support How to disable one line in a multiline line chart Reply To: How to disable one line in a multiline line chart

#14154

I’m so dumb, I figured it out. To do this, just set the visibility to false for the line you want hidden, like this:

visible: false,

Then, setup a click event handler so you can turn the line ‘on’ when it’s clicked in the legend.

legend: {
            cursor: "pointer",
            itemclick: function (e) {
              //console.log("legend click: " + e.dataPointIndex);
              //console.log(e);
              if (typeof (e.dataSeries.visible) === "undefined" || e.dataSeries.visible) {
                    e.dataSeries.visible = false;
              } else {
                    e.dataSeries.visible = true;
              }
 
              e.chart.render();
            }
        },

References:
https://canvasjs.com/docs/charts/chart-options/data/visible/
https://canvasjs.com/docs/charts/how-to/hide-unhide-data-series-chart-legend-click/

  • This reply was modified 7 years, 2 months ago by davidr.
  • This reply was modified 7 years, 2 months ago by davidr.