HighCharts：在图例标题下方显示总值

Question

我能够在 angular2-highcharts 中显示图例和图例标题。我打算在图例标题下方显示总计数（这里在城市下方），但无法找到方法。我也不确定为什么 % 与图例值中的值一起显示。

我的标签格式化程序是：

  labelFormatter: function () {
      return '<div class="legend-label-md row" style=" border-bottom:1px solid black; margin-bottom: 5px"><span class="col-md-10">' + this.name +
             '</span><span class="col-md-2" >' + this.value +
              '%</span></div> ';
       }

https://plnkr.co/edit/yzXLz7AIDoWa1Pzxxl4k?p=preview

Answer 1

每个饼系列点都有该系列的总计，因此您可以更新图表的加载事件图例以包括该系列的总计。

演示：https://plnkr.co/edit/6JW1KmYE1Lr4pAIWCJTm?p=preview

模板为：

template: `
    <chart  [options]="options" (load)="onLoad($event)">
    </chart>
`

在class AppComponent中：

    onLoad (e) {
                var chart = e.context,
                    total = chart.series[0].points[0].total;
                chart.update({
                    legend: {
                        title: {
                            text: 'City<br/><span style="font-size: 9px; color: #666; font-weight: normal">(Total: ' + total + ')</span>' 
                        }
                    }
                })
              };

HighCharts：在图例标题下方显示总值

HighCharts: Display total value below the legend title

highcharts

angular2-highcharts