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'
$(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.
] 2。在这种情况下,可以选择多个部分,但在再次单击时不会取消选择它们。
Please help !!
请帮忙 !!
2 个解决方案
#1
4
Try this solution: http://jsfiddle.net/3zy8p/13/
试试这个解决方案: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());
}
}
}
}
}
#2
1
Shift + Mouseclick
or CTRL + Mouseclick
lets you select/deselect 'points'. Does the job by simply setting:
Shift +鼠标点击或CTRL +鼠标点击可让您选择/取消选择“点数”。通过简单设置来完成工作:
allowPointSelect : true
allowPointSelect:true
#1
4
Try this solution: http://jsfiddle.net/3zy8p/13/
试试这个解决方案: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());
}
}
}
}
}
#2
1
Shift + Mouseclick
or CTRL + Mouseclick
lets you select/deselect 'points'. Does the job by simply setting:
Shift +鼠标点击或CTRL +鼠标点击可让您选择/取消选择“点数”。通过简单设置来完成工作:
allowPointSelect : true
allowPointSelect:true