Chartjs：使用 Chartjs-plugin-datalabels 在较小的数据集中数据标签重叠

Question

我正在使用 Chartjs-plugin-datalabels，并且在大图表中显示较小的数据集时值重叠

这是 Chartjs-data-plugin 配置

options: {
        plugins: {
            datalabels: {
                    color: 'black',
                    clamp:true,
                    display: function(context) {
                        return context.dataset.data[context.dataIndex] >= 1;
                    }
            }
        }
    }

Answer 1

尝试将显示设置为自动。

当两个标签重叠时，根据以下规则，可以使用 display: 'auto' 选项来防止标签重叠：

• 如果两个标签都显示：true，则它们将重叠绘制
• 如果两个标签都显示：'auto'，则数据索引最高的标签将
  被隐藏。
• 如果标签位于相同的数据索引，则数据集索引最高的标签将
  被隐藏。
• 如果一个标签为 display: true 而另一个标签为 display: 'auto'，则带有 'auto' 的标签将被隐藏（无论数据/数据集索引如何）

访问https://chartjs-plugin-datalabels.netlify.app/guide/positioning.html#visibility