高亮点击栏系列

Question

有没有在kendo中内置的方法，当用户点击条形图项目时，它会突出显示所有对应的项目？

例如下面的fiddle，有五项。如果我在 first bar (1970) 中单击 item1，它应该在 second bar (1975) 中突出显示 item1。

series: [{
   type: "column",
   field: "value",
   stack: true,
   name: "#= group.value #"
}],

Answer 1

您可以添加 seriesClick 事件。然后确定哪个系列被点击并使用 toggleHighlight() 方法关闭所有其他系列的突出显示并为被点击的系列打开它：

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);
}

高亮点击栏系列

Highlight clicked bar series

javascript

kendo-ui

kendo-chart

已更新FIDDLE