跨多个高图表更改系列onclick事件的颜色
跨多个高图表更改系列onclick事件的颜色
提问于 2015-11-28 18:25:55
我希望根据图例或实际列/线的单击，在多个图表中更改同一系列的列色和行色。
在个别图表上，我有基于点击/悬停的颜色变化，我可以根据第一个图例的点击显示隐藏。我只是看不出这颜色有多好。我想把节目隐藏功能转换成颜色变化。
小提琴：http://jsfiddle.net/jlm578/asdgqzgk/4/
这是我想转换或替换的代码块：
events: {
legendItemClick: function (event) {
var visibility = this.visible ? 'visible' : 'hidden';
var series = $('#veiOverallAllLine').highcharts().series[this.index];
if (this.visible) series.hide();
else series.show();
return true;
//return false;
}
}回答 1
Stack Overflow用户
回答已采纳
发布于 2015-11-28 22:40:04
我希望我能正确地理解您的问题:)无论如何，您可以通过首先防止执行默认操作(这显然是隐藏图表)，将事件“转换”为颜色更改。
这可以很容易地在事件本身内使用event.preventDefault()来完成。
您可以使用一个通用函数来处理颜色更改，该函数以该系列作为参数，查找其“兄弟姐妹”并更改颜色：
function updateColor(series){
if(series == undefined) return;
var color = series.color == '#ffffff' ? '#851E20' : '#ffffff';
var sibling = $('#veiOverallAllLine').highcharts().series[series.index];
series.update({color:color});
sibling.update({color:color});
}(这里可以做更多的概括，但这取决于你。)
与之相比，整个plotOptions应该或多或少地是这样的：
plotOptions: {
series: {
allowPointSelect: true,
states: {
select: {
color: '#851E20'
}
},
events: {
click: function(){
updateColor(this);
},
legendItemClick: function (event) {
event.preventDefault();
updateColor(this);
return true;
}
}
}
},在这里你可以看到一个例子：http://jsfiddle.net/a366e89c/2/注释！在示例中，只有上面的图表改变了两个图表的颜色，您只需要将线条复制到第二个图表中.
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/33974853
复制相关文章
相似问题
腾讯云开发者
