Highcharts甜甜圈图例切换 [英] Highcharts donut legend toggle

查看:109
本文介绍了Highcharts甜甜圈图例切换的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用高图饼图制作甜甜圈图。问题是当我点击图例来切换系列时,它只会影响被点击的系列。我也想切换相关的子系列。我尝试了 LegenditemClick 事件和 legendIndex ,但迄今为止没有成功。下面是图表示例: http://jsfiddle.net/safarov/PgpRv/
当你点击脸谱传说,例如,只有内部派皮。



任何帮助将不胜感激

解决方案

您需要为内圈和外圈设置ID。然后通过legendItemClick通用它并按id搜索正确的点。

  legendItemClick:function(){
var id = this .id,
data = this.series.chart.series [0] .data;
$ .each(data,function(i,point){

if(point.parentId == id){
if(point.visible)
point .setVisible(false);
else
point.setVisible(true);
}

});
}

http://jsfiddle.net/sbochan/PgpRv/4/

Im using a highchart pie chart to make Donut chart. The problem is when I click on legend to toggle series it only affects the clicked serie. I want to also toggle related sub series. I have tried LegenditemClick event and legendIndex , but no success so far. Here example for chart: http://jsfiddle.net/safarov/PgpRv/ When you click "facebook legend" for example, only inner pie hide.

Any help will be appreciated

解决方案

You need to set ids for inner and outer rings. Then common it by legendItemClick and search correct point by id.

legendItemClick: function () {
                    var id = this.id,
                        data = this.series.chart.series[0].data;
                    $.each(data, function (i, point) {

                        if (point.parentId == id) {
                            if(point.visible)
                                point.setVisible(false);
                            else
                                point.setVisible(true);
                        }

                    });
                }

http://jsfiddle.net/sbochan/PgpRv/4/

这篇关于Highcharts甜甜圈图例切换的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆