ChartJS：如何将顶部标签与底部标签对齐？

Question

我有一个由chartJS制成的图表，该图表显示每月数据。图表顶部有一个顶部标签，指示每个新月。它是通过xAxes生成的：

{
          position: "top",
          ticks: {
            autoSkip: false,
            maxRotation: 0,
            callback: (_, i) => i
          },

它可以工作，但是顶部标签逐渐从底部标签转移。有点奇怪。如何解决？

screenshot 我的代码是：

   

{
    legend: { display: false },
    scales: {
      yAxes: [
        {
          stacked: true,
          ticks: {
            beginAtZero: true,
          },
          gridLines: {
            display: true,
            zeroLineColor: "black,
            zeroLineWidth: 0.5
          }
        }
      ],
      xAxes: [
        {
          offset: true,
          stacked: true,
          ticks: {
            fontColor: "black",
          },
          gridLines: {
            color: "transparent",
            zeroLineColor: "black,
            z: 1
          }
        },
        {
          position: "top",
          ticks: {
            autoSkip: false,
            maxRotation: 0,
            callback: (_, i) => i
          },
          gridLines: {
            drawBorder: false,
            display: true,
            lineWidth: 0.5
          }
        }
      ]
    }