Chart.js v3：如何允许刻度标签溢出？答案

【问题标题】：Chart.js v3: how to allow tick label overflow?Chart.js v3：如何允许刻度标签溢出？
【发布时间】：2021-08-31 22:51:50
【问题描述】：

我最近从 Chart.js v2 升级到 v3。我正在绘制带有基于时间的 x 轴的实时折线图，随着时间的推移向右滚动。

在 Chart.js v3 中，当我的 x 轴刻度标签开始接近图表的左边缘时，它会调整图表的大小以适合整个标签。如附图所示，这会在我的图表左侧创建一个空白。在 Chart.js v2 中，它不会调整图形大小，而是允许标签溢出画布。

我的 x 轴选项是：

{
  type: 'time',
  axis: 'x',
  min: minDate.getTime(),
  max: maxDate.getTime()
  time: {},
  ticks: {
    minRotation: 45,
    maxRotation: 45,
    source: 'labels'
  }
};

是否有任何选项可以恢复旧行为并允许刻度标签溢出？

【问题讨论】：

标签： chart.js linechart

【解决方案1】：

您可以将第一个刻度格式化为空字符串，使用 ticks.callback

{
  type: 'time',
  ticks: {
    callback: (value, index) => index === 0 ? '' : value
  }
}

example in codepen

【讨论】：