Highcharts饼图：如何忽略禁用的图例项

Please see this JSFiddle.

请看这个JSFiddle。

In this example, you can see sum of all values at top left corner.

在此示例中,您可以在左上角看到所有值的总和。

If you click on any legend item, it will be disabled, but the total value doesn't reflect it. The text should be updated to not include that disabled item. How can I do this?

如果单击任何图例项,它将被禁用,但总值不会反映它。应更新文本以不包括该禁用的项目。我怎样才能做到这一点?

2 个解决方案

#1

You can use the legendItemClick event to update the rendered text by keeping a reference to the Element. For example:

您可以使用legendItemClick事件通过保持对Element的引用来更新呈现的文本。例如:

var totalText;

var chart = new Highcharts.Chart({
    chart: {
        events: {
            load: function(event) {
                totalText = this.renderer.text(
                    'Total: ' + total,
                    this.plotLeft,
                    this.plotTop - 20
                ).attr({
                    zIndex: 5
                }).add()
            }
        }
    }

    //...

    plotOptions: {
        pie: {
            point: {
                events: {
                    legendItemClick: function(e) {
                        var newTotal = this.series.total + (this.visible ? -this.y : this.y);
                        totalText.attr({ text: 'Total: '+newTotal });
                    }
                }
            }
        }
    }
});

See this updated JSFiddle for a demonstration.

有关演示,请参阅此更新的JSFiddle。

#2

While Ondkloss's answer works fine. But I have found a simpler solution, by using redraw event instead of load. JSFiddle

虽然Ondkloss的答案很好。但我找到了一个更简单的解决方案,使用重绘事件而不是加载。的jsfiddle

#1