0

Is there any built in method in kendo when user clicks on the bar chart item, then it will highlight all corresponding items?

For example in the following fiddle, there are five items. If I click item1 in the first bar (1970), it should highlight item1 in second bar (1975).

series: [{
   type: "column",
   field: "value",
   stack: true,
   name: "#= group.value #"
}],
mystackoverflow
  • 357
  • 1
  • 4
  • 10

1 Answers1

1

You can add the seriesClick event. Then determine which series was clicked and use the toggleHighlight() method to turn off highlighting on all other series and turn it on for the clicked one:

seriesClick: function(e) {
    var clickedSeries = e.series.name;
    var chart = $("#chart").data("kendoChart");
    for (var i=0; i< chart.options.series.length; i++){
        chart.toggleHighlight(false, chart.options.series[i].name);
    }
    chart.toggleHighlight(true, clickedSeries);
}

Updated FIDDLE

ezanker
  • 24,628
  • 1
  • 20
  • 35
  • I could not able to find a way to highlight border or paired objects on bar stack. Do you have any idea for the following question which is related this question. http://stackoverflow.com/questions/30632657/more-pronounce-highlight-effect – mystackoverflow Jun 03 '15 at 23:54