验证Highcharts中的Pie图表是否被选择或取消选择。

Question

我必须在饼被选中时显示一个弹出窗口，而在取消选择时不做任何操作。我无法在点击事件上弄清楚如何弄清楚派是被用户选择还是被删除。我试着在那里做佩林JS逻辑，但是有点bug。Highcharts提供的解决方案有吗？

                        chart: {
                            type: 'pie',
                            marginLeft: 0,
                            options3d: {
                                enabled: false,
                                alpha: 45,
                                beta: 0
                            }
                        },
                        tooltip: {
                            formatter: function(){

                            }
                        },
                        plotOptions: {
                            pie: {
                                allowPointSelect: true,
                                cursor: 'pointer',
                                depth: 35,
                                dataLabels: {
                                    enabled: true,
                                    formatter: function(){

                                    }
                                },
                                showInLegend: true,
                                point: {
                                    events: {
                                        click: function(){

                                            var selectedPieSliceIndex;
                                            if(!this.selected) {
                                                selectedPieSliceIndex = this.x;
                                            }
                                            else {
                                                selectedPieSliceIndex = null;
                                            }
                                            chartComponent.trigger("onPieSliceClick", selectedPieSliceIndex);
                                            var that = this;
                                            if (this.pieSelected && clickedSliced.length > 0){
                                                that.pieSelected = false;
                                                clickedSliced = [];
                                            } else {
                                                that.pieSelected = true;
                                                clickedSliced.push(that.name)
                                            }

                                            if(this.pieSelected && clickedSliced.length){

                                           uiDialogue.loadDialog('Chart Initiatives', jsonData);

                                            }

                                        }
                                    }
                                }
                            }
                        },
                        series: [
                            {
                                type: 'pie',
                                innerSize: 100 ,
                                depth: 45  ,
                                name: '',
                                data: pieChartSeries
                            }
                        ],
                        title: {
                            text: "",
                            verticalAlign: 'middle',
                            x: -3,
                            y: -4,
                            floating: true,
                        },
                        exporting: {
                            chartOptions: {
                                plotOptions: {
                                    pie: {
                                        dataLabels: {

                                            }
                                        }
                                    }
                                }
                            }
                        }
                    }

有什么建议或者Highchart有什么内置的解决方案吗？

Answer 1

你有没有试过做这样的事情？

演示一下。https:/jsfiddle.netBlackLabel3qxL5r7f

  point: {
    events: {
      click: function() {
        if (!this.selected) {
          console.log('show popup')
        } else {
          console.log('hide popup')
        }
      }
    }
  }