在highchart饼图上显示所有数据标签

Question

我有一个 highchart 饼图，但它没有显示所有数据标签。它只显示较大切片的数据标签。我希望图表显示所有数据标签，甚至是较小切片的数据标签。 有没有办法格式化图表以查看所有数据标签？有人可以帮忙吗？ 示例代码

function generatePieData(numPieces) {
    let data = [];
    for (let i = 1; i <= numPieces; i++) {
        let piece = {
            y: i
        };
        data.push(piece);
    }
    return data;
}

Highcharts.chart('container', {
    chart: {
        type: 'pie'
    },
    title: {
        text: ''
    },
    series: [{
         dataLabels: {
                enabled: true,
                format: '<b>{point.name}</b>: {point.percentage:.1f} %'
            },
        borderWidth: 0,
        borderRadius: 0,
        data: generatePieData(100)
    }]
});```

Answer 1

当空间不足时，Highcharts 将有选择地显示数据标签，以确保图表保持清晰。默认情况下，每个数据标签都包含填充，如果它与另一个标签重叠，它将被隐藏。要显示所有数据标签，必须将填充调整为 0。

因此，在您的代码中在 dataLabels 中添加 padding: 0 ，如下所示：

Highcharts.chart('container', {
chart: {
    type: 'pie'
},
title: {
    text: ''
},
series: [{
     dataLabels: {
            enabled: true,
            format: '<b>{point.name}</b>: {point.percentage:.1f} %',
            padding: 0
        },
    borderWidth: 0,
    borderRadius: 0,
    data: generatePieData(100)
}]
})

希望这有帮助！