Highcharts：森伯斯特图表能否显示百分比份额来描绘像饼图一样的整体关系？

Question

百分比分数用于描绘图表中的部分与整体关系。

观察饼图系列数据标签中使用的 point.percentage 属性，以显示相对于整个图表的百分比份额： http://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/demo/pie-basic/

 plotOptions: {
    pie: {
        allowPointSelect: true,
        cursor: 'pointer',
        dataLabels: {
            enabled: true,
            format: '<b>{point.name}</b>: {point.percentage:.1f} %',
            style: {
                color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
            }
        }
    }
}

我想实现以下目标：

此示例的参考：https://www.grapecity.com/en/blogs/sunburst-chart-roadmap-what-would-you-like-to-see

我知道，相对于父母和整个图表的上述百分比份额，可以通过手动设置相应的值来实现。但这涉及手动计算。

我想知道Highcharts是否支持Sunburst图表的point.percentage。它没有在API参考中给出，我也没有在JS Fiddle中调试一个例子。有没有其他方法可以实现它？

Answer 1

不，point.percentage仅适用于堆叠系列或馅饼：https://api.highcharts.com/class-reference/Highcharts.Point#.percentage

但是，如果您使用dataLabels.formatter，则很容易计算每个切片的百分比。在formatter函数中，您可以访问当前切片（point）和所有其余图表数据：

分享w.r.t父片的百分比

dataLabels: {
    formatter: function() {
        var point = this.point,
            group = this.series.data.filter(x => x.parent === point.parent);

        var groupTotal = group.map(x => x.value).reduce((a, b) => a + b, 0),
            percentage = 100 * point.value/groupTotal;

        return point.name + '<br>' + percentage.toFixed(1) + '%';
    },
},

http://jsfiddle.net/cre0psov/1/