Question

我正在使用带有数据标签插件的Chart JS，我想在条形图和饼图旁边显示数据标签，但是注意到某些数据标签正在被剪切或从画布中移出。他们有什么方法可以解决这个问题吗？

    var chartData3 = {
        labels: ["January", "February", "March", "April", "May", "June"],
    datasets: [{
      backgroundColor: "#79D1CF",
      data: [60, 90, 81, 56, 55, 40],
      datalabels: {
        align: 'end',
        anchor: 'end'
      }
    }]
  };

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

谢谢， MSK

Answer 1

您需要设置填充以正确显示标签。此外，调整画布宽度和高度以考虑填充，以便您的图表不会太小。

options: {        
    layout: {
        padding: {
            left: 50,
            right: 50,
            top: 50,
            bottom: 50
        }
    }
}

Answer 2

在图表选项中设置最大刻度，例如：

this.chartOption.scales.yAxes[0].ticks.max = Math.max(...chartData3.datasets[0].data) * 1.2

图表JS数据标签被削减

2 个答案: