highcharts饼图多节选择 [英] highcharts pie chart multiple sections selection

问题描述

我想在饼图中选择多个部分。如果它已被选中，则应单击未选中的部分。

我在此处找到了一个示例。但是在这种情况下，只有一个部分可以被选中，并且选中的部分可以在点击任何其他部分时被取消选择。

同样，我发现了另一个例子[

lockquote>

$（function（）{
var chart = new Highcharts.Chart（{
chart：{
renderTo：'container'，
type：'pie'）

 }，
 plotOptions：{
 series：{
 states：{
 hover：{
 enabled：false 
 
 
 
 $ b $ click $ b $ this.graphic.attr {
填写：'黄色'
}）; 
} 
} 
} 
} 
}，
工具提示：{
已启用：false 
}，
 series：[{
 data：[{
 name：'test'，
y：29.9，
 color ：#CCCCCC，
 active：false 
}，{
 name：'test2'，
y：71.5，
 color：#CCCCCC，
 active：false 
}，{
 name：'test3'，
y：106.4，
 color：#CCCCCC，
 active：false 
}] 
}] 
}）; }）; 
  

] 2 。在这种情况下，可以选择多个部分，但不会在再次单击时取消选择。

请帮忙!! 试试这个解决方案： http://jsfiddle.net/3zy8p/13/

  plotOptions：{
 series：{
 point：{
 events：{
 click：function（event）{
 this.slice（null）; 
 this.select（null，true）; 
 console.log（this.series.chart.getSelectedPoints（））; 
} 
} 
} 
} 
} 
  

I want to select multiple sections in pie chart. And section should be unselected on clicking, if it is already selected.

I found an example here. But in this case, only one section can be selected and selected ones get deselected on clicking on any other section.

Similarly, I found another example [

$(function () { var chart = new Highcharts.Chart({ chart: { renderTo: 'container', type: 'pie'

    },
    plotOptions: {
        series: {
            states: {
                hover: {
                    enabled: false
                }
            },
            point: {
                events: {
                    click: function () {
                        this.graphic.attr({
                            fill: 'yellow'
                        });
                    }
                }
            }
        }
    },
    tooltip: {
        enabled: false
    },
    series: [{
        data: [{
            name: 'test',
            y: 29.9,
            color: "#CCCCCC",
            active: false
        }, {
            name: 'test2',
            y: 71.5,
            color: "#CCCCCC",
            active: false
        }, {
            name: 'test3',
            y: 106.4,
            color: "#CCCCCC",
            active: false
        }]
    }]
}); });

]2. In this case multiple sections can be selected but they are not deselected on clicking again.

Please help !!

解决方案

Try this solution: http://jsfiddle.net/3zy8p/13/

    plotOptions: {
        series: {
            point: {
                events: {
                    click: function(event){
                        this.slice(null);
                        this.select(null, true);
                        console.log(this.series.chart.getSelectedPoints());
                    }
                }  
            }                    
        }
    }

这篇关于highcharts饼图多节选择的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！