单击的系列将突出显示，其他系列将显示为略微褪色

Question

我有以下 kendo 图表的实现，现在我的要求是

点击系列正常显示，其他系列淡化（设置一些不透明度）

如何在 kendo 图表中实现 type:bar

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

这里是 fiddle

http://jsfiddle.net/kcbvtutu/

Answer 1

我只是在循环中设置了系列的不透明度然后它就起作用了。

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);
        item.opacity = 0.3
     }
   chart.toggleHighlight(true, clickedSeries);
}

刚刚在循环中添加了以下行

item.opacity = 0.3

然后成功了。

单击的系列将突出显示，其他系列将显示为略微褪色

Clicked series to be highlighted and other series to be shown as little faded

javascript

kendo-ui

kendo-chart