配置 Chart.js 在 Node.js 中渲染图表时在 x 轴刻度上显示小时

Question

我正在使用图表js在节点中生成图表图像，我如何在刻度上使用小时，有什么想法吗

Error: This method is not implemented: Check that a complete date adapter is provided.

import chartjs - adapter - date - fns from 'chartjs-adapter-date-fns'
var lineChartDetails: ChartConfiguration = {
  type: 'line',
  data: {
    datasets: [{
      label: 'Sample Dataset',
      data: dataPoints,
      borderColor: 'rgb(75, 192, 192)',
      tension: 0.1
    }]
  },
  options: {
    scales: {
      x: {
        type: 'time',
        time: {
          unit: 'day',
          tooltipFormat: 'MMM dd, yyyy'
        }
      }
    },
    plugins: {
      tooltip: {
        callbacks: {
          title: function(tooltipItems) {
            return tooltipItems[0].label;
          }
        }
      }
    }
  }
};

Answer 1

无论您在何处注册图表，请确保从 Chart.js 注册 TimeScale，并更新导入以直接导入整个 Chartjs-adapter-date-fns。这是我的配置方式：

import { Line } from 'react-chartjs-2';

import {
    TimeScale,
    LinearScale,
    CategoryScale,
    Title,
    PointElement,
    LineElement,
    Tooltip,
    Chart,
    Filler,
} from 'chart.js';
    
import 'chartjs-adapter-date-fns';

Chart.register(
    CategoryScale,
    LinearScale,
    Title,
    PointElement,
    LineElement,
    Tooltip,
    TimeScale,
    Filler,
);

export default Line;