Home Forums Chart Support Question: How to toggle series using the legend

Question: How to toggle series using the legend

Viewing 7 posts - 1 through 7 (of 7 total)
  • #3766

    Is there a way to attach an onclick event handler to the legendText items in the legend? I would like to be able to toggle a series on or off using the legend.

    Thanks, and canvasjs is the best charting software I’ve found!


    Thank you Andy,

    This feature is not available yet. We will add it in coming versions.

    Team CanvasJS


    Mentioned feature would be a great help in my work.



    This feature is planned for version 1.3 – which might take around a month.


    workaround for this could be to add a event handler.. i added a click event to hide data series as below.
    works but there are event collisions and it appears that the tooltip is using a “previousDataPointEventObject” object which gets lost when i ravage the data object. this makes the errors stack up pretty quick but is effective until i figure out how to reset the previousDataPoint

    //appending series
                  type: 'spline',
                  dataPoints: x.data[key],
                  click: seriesToggle,
                  showInLegend: true,
                  toolTipContent: "<b>{name}</b><br>{x}: {y}",
                  name: key,
                  legendText: key
      function seriesToggle(e){
        if(chart.options.data.length == 1){//restore..
          chart.options.data = data.chart;
          data.chart = [];//clear backup
        } else {
          var series = e.dataSeries.name;
          data.chart = chart.options.data;//backup data
          for(var i in data.chart){
            if(data.chart[i].name == series){
              chart.options.data = [ data.chart[i] ]; //only show clicked series


    I have this feature in my todo list. It was supposed to be implemented in next version but has been postponed slightly because of IE78 support which is coming next… As as temporary measure you can wrap it inside a try catch block. I’ll be coming up with a proper solution soon.




    In version 1.4 beta we have implemented legend events and “visible” property for dataseries. Using these features we can toggle data series on legend click. Do have a look.

    Sunil Urs

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.