New to Kendo UI for jQuery? Start a free 30-day trial

Fires when an legend item is clicked, before the selected series visibility is toggled. Can be cancelled.

Event Data

e.pointIndex Number

The point index.

e.preventDefault Function

If invoked the default action (toggle series visibility) will be prevented.

e.sender kendo.dataviz.ui.Chart

The widget instance which fired the event.

e.series Object

The series options.

e.seriesIndex Number

The series index.

e.text String

The name of the series.

e.element Object

The DOM element of the plot area.

<div id="chart"></div>
<script>
  $("#chart").kendoChart({
    series: [
      { data: [6, 2, 3], name: "Task 1" },
      { data: [1, 5, 2], name: "Task 2" }
    ],
    legendItemClick: function(e){
/* The result can be observed in the DevTools(F12) console of the browser. */
    	console.log("Clicked an item with text: " + e.text);

      //prevent toggling the series visibility on legend item click
      e.preventDefault();
    }
  });
</script>
<div id="chart"></div>
<script>
  function chart_legendClick(e){
/* The result can be observed in the DevTools(F12) console of the browser. */
    console.log("Clicked an item with text: " + e.text);

    //prevent toggling the series visibility on legend item click
    e.preventDefault();
  }
  $("#chart").kendoChart({
    series: [
      { data: [6, 2, 3], name: "Task 1" },
      { data: [1, 5, 2], name: "Task 2" }
    ]
  });
  var chart = $("#chart").data("kendoChart");
  chart.bind("legendItemClick", chart_legendClick);
</script>
Not finding the help you need?
Contact Support