单击 legendItem 后如何在高图中保留空白切片区域

Question

在这个例子中http://www.highcharts.com/demo/pie-legend

标签点击，切分饼图部分。我需要将可见设置为点击的饼图部分，但是当我使用 setVisible 函数时，我有默认行为，除非我有 return false，ex.

       pie: {
                point: {
                    events: {
                        legendItemClick: function (event) {
                            var visibility = this.visible;

                            this.setVisible(!visibility);

                            return false;
                        }
                    }
                },
            }

Answer 1

看看这是否适合你：

    series: {
        point: {
            events: {
                legendItemClick: function () {
                    var colors = this.series.chart.options.colors;
                    var newColor = (
                        this.color == 'transparent' 
                        ? colors[this.index] 
                        : 'transparent'
                    );
                    this.update({color:newColor});
                    return false; 
                }
            }
        }
    }

单击图例项时，它会将点的颜色更新为 'transparent'。

示例：

http://jsfiddle.net/jlbriggs/g15uduwu/

[[使用更新的代码进行编辑以说明返回原始颜色]]

Answer 2

您可以使用 ignoreHiddenPoint 选项设置为 false 以在图例中停用切片区域后使其保持打开状态。

示例代码（JSFiddle）：

plotOptions: {
    pie: {
        ignoreHiddenPoint: false
    }
}

Answer 3

您需要捕获 legendItemClick 并自定义操作，在事件中返回 FALSE。

legendItemClick: function () {
                            var point = this,
                                vis;

                            point.visible = point.options.visible = vis = vis === UNDEFINED ? !point.visible : vis;
                             this.series.chart.legend.colorizeItem(point, vis);

                            if(vis) {
                                point.graphic.attr({
                                    opacity:1
                                });
                                point.dataLabel.show();
                                point.connector.show();
                            } else {
                                point.graphic.attr({
                                    opacity:0
                                });
                                point.dataLabel.hide();
                                point.connector.hide();
                            }

                            return false;
                        }

示例：http://jsfiddle.net/x65f5qaz/1/

单击 legendItem 后如何在高图中保留空白切片区域

How to keep an empty slice area in highcharts after clicking on legendItem

charts

highcharts