javascript - 如何使用 Chart.js 在 X 轴上显示带有网格线的刻度线和标签？

Question

感谢您关注这个问题。

我想像图片一样添加带有网格线的刻度线和 3 个标签，但我找不到使 X 轴像图片一样的最佳解决方案。希望有人帮助我。

标签： javascriptchart.js

Answer 1

将此用于您的标签数组：

labels: [["jan", 20], "", "", "", "", "", ["jul", 20], "", "", "", "", "", ["jan", 21]],

这对您的选项对象：

options: {
    scales: {
        xAxes: [{
            ticks: {
               callback: (label) => (label === "" ? null : label)
          }
      }]
    }
  }

将得到以下结果：

由于刻度线是从网格线生成的，它们也消失了，不知道如何解决这个问题