Chart.JS 在标签中格式化日期

Question

如何在 Chart.JS 的数据点标签中格式化日期？

我试过了：

this.chart = new Chart(ctx,
  {
    data: {
      labels: timestamps 
                .map(t => t.toLocaleString([], { month: '2-digit', day: '2-digit', year: '2-digit', hour: '2-digit', minute: '2-digit' })),
      datasets: [
        {
          data: measurements
        }, 
        //etc...
]}});

它有效，但我收到一条 Moment.JS 警告消息：

弃用警告：提供的值不是公认的 RFC2822 或 ISO 格式...不鼓励使用非 RFC2822/ISO 日期格式，并将在即将发布的主要版本中删除。

由于我使用的方法显然不鼓励使用，因此是否有适当的方法来格式化 Chart.JS 中数据标签的日期？

与labels: timestamps

与labels: timestamps.map(t => t.toLocaleString(...)

Answer 1

我通过查看 Chart.js 提供的a sample chart 的 HTML 源文件找到了答案。

为了正确格式化日期，必须将 parser 和 tooltipFormat 属性添加到相关轴。修复我上面给出的示例：

this.chart = new Chart(ctx,
  {
    type: 'line',
    data: {
      labels: timestamps,
      datasets: [
        {
          data: measurements,
        }
      ]
    },
    options: {
      scales: {
        xAxes: [ {
            display: true,
            type: 'time',
            time: {
              parser: 'MM/DD/YYYY HH:mm',
              tooltipFormat: 'll HH:mm',
              unit: 'day',
              unitStepSize: 1,
              displayFormats: {
                'day': 'MM/DD/YYYY'
              }
            }
          }
        ],
        yAxis: [
          // etc...
        ],
      }
    }
  }
);