javascript - 如何避免highchart饼图中数据标签重叠？

Question

我正在使用 highcharts 来渲染饼图，

当系列数据较小/较少时，数据标签会重叠。

链接到重现的问题。

http://jsfiddle.net/venkatesh1453/nwg2rdze/1/

 plotOptions: {
        pie: {
            dataLabels: {
                distance : function(){
                    return (-30 - (this.series.index *3));
                }
            }
        }
    },

我尝试了这段代码，但它将所有标签移动到右上角。

请提供避免标签重叠的解决方案/解决方法。

Answer 1

最简单的方法是将数据标签移到饼图之外。

$(function () {
    $('#container').highcharts({
        chart: {
            type: 'pie'
        },
        series: [{
            data: [
                ['Firefox',   44.2],
                ['IE7',       26.6],
                ['IE6',       20],
                ['Chrome browser',    1.1],
                ['Other browsers',    1.4]
            ]
        }]
    });
}); 

Example