react-chartjs-2个时间适配器,“时间”不是已注册的刻度

bweufnob  于 2022-11-06  发布在  Chart.js
关注(0)|答案(1)|浏览(216)

我尝试将时间适配器导入到我的ReactJS项目中,但看起来好像不起作用。我无法配置Chart.js来使用“chartjs-adapter-date-fns”。我的代码如下所示。
我是这样导入的:

import {
  Chart as ChartJS,
  LinearScale,
  PointElement,
  Tooltip,
  Legend,
} from "chart.js";
import "chartjs-adapter-date-fns";
import { Bubble } from "react-chartjs-2";

ChartJS.register(LinearScale, PointElement, Tooltip, Legend);

图表的配置:

const data = {
    datasets: [
      {
        label: "TheDataset1",
        data: theDataArray1,
        backgroundColor: "#782D2D",
      },
    ],

const options = {
    scales: {
      x: {
        type: "time",
      },
      y: {
        beginAtZero: true,
      },
    },
  };

下面是我如何部署到ReactDOM的:

<Bubble options={options} data={data} />

当我从选项中删除timetype时,错误消失,我在X轴上看到毫秒历元。当我添加**time type时,**console.log出现此错误,我的内容无法呈现。

>Error 1:
Uncaught Error: "time" is not a registered scale.

>Error2:
he above error occurred in the <ForwardRef(ChartComponent)> component:

>Error3:
Uncaught Error: "time" is not a registered scale.
nkkqxpd9

nkkqxpd91#

修正了从Chart.js模块导入“TimeScale”的问题。然后在Chart.register函数中添加TimeScale参数。最后:

import {Chart, LinearScale, PointElement, Tooltip, Legend, TimeScale} from "chart.js"; 

ChartJS.register(LinearScale, PointElement, Tooltip, Legend, TimeScale);

这些东西修好了一切。

相关问题