ChartJS 3.0.2.中的TimeSeries刻度带来错误“此方法未实现：找不到适配器或集成不完整...”

crcmnpdw 于 2022-12-23 发布在 Chart.js

关注(0)|答案(5)|浏览(201)

我升级到了最新的Chart.JS版本3.0.2.我正在尝试获取一个时间序列图来渲染。

{
  type: 'line',
  data: {
    datasets: [{
      data: dataForChart
    }]
  },
  options: {
    scales: {
      x: {
        type: 'time'
      }
    }
  }
}

我导入了如下模块：

import ChartJS from 'chart.js/auto';

我得到的错误是：

Error: This method is not implemented: either no adapter can be found or an incomplete integration was provided.

有什么建议我可能做错了什么吗？
下面是一个代码沙盒，其中包含该问题：https://codesandbox.io/s/throbbing-cdn-j6q2u?file=/src/App.js

chart.js

来源：https://stackoverflow.com/questions/67017539/timeseries-scale-in-chartjs-3-0-2-brings-error-this-method-is-not-implemented

5条答案

按热度按时间

xxb16uws1#

您需要安装和导入一个适配器，在您的情况下，它是时间序列的时刻适配器
第一个月
然后将其导入到组件中：import 'chartjs-adapter-moment';
有关适配器的详细信息，请检查以下内容

赞(0）回复(0）举报 2022-12-23

2w3rbyxf2#

这个答案来得有点晚，但对于每个在这里跌倒的人来说：您需要一个日期适配器。请查找full list here
在根目录中通过npm install date-fns chartjs-adapter-date-fns --save安装date-fns后，必须执行两项操作才能使其在React项目中工作：
1.将其添加到文件import 'chartjs-adapter-date-fns';和import { enUS } from 'date-fns/locale';的顶部
1.在您的选项中：

options = {
  ... 
  scales: {
    x: {
      type: 'time',

      // add this: 
      adapters: { 
        date: {
          locale: enUS, 
        },
      }, 
    }
  },
  ... 
}

赞(0）回复(0）举报 2022-12-23

mepcadol3#

你需要一个适配器如上所述。看这里：https://github.com/chartjs/chartjs-adapter-date-fns#cdn
一个选项是添加以下cdn链接：

<script src="https://cdn.jsdelivr.net/npm/chart.js/dist/chart.min.js"></script>
   
<script src="https://cdn.jsdelivr.net/npm/chartjs-adapter-date-fns/dist/chartjs-adapter-date-fns.bundle.min.js"></script>

赞(0）回复(0）举报 2022-12-23

5cnsuln74#

如错误和文档中所述，您需要一个适配器来将日期转换为日期对象，请参见文档：https://www.chartjs.org/docs/latest/axes/cartesian/time.html#date-adapters

赞(0）回复(0）举报 2022-12-23

uqdfh47h5#

我认为你应该像下面的代码那样把list放在x中。

scales: {
  x: [{
    type: 'time'
  }]
}

赞(0）回复(0）举报 2022-12-23

我来回答

ChartJS 3.0.2.中的TimeSeries刻度带来错误“此方法未实现：找不到适配器或集成不完整...”

5条答案

相关问题

热门标签

最新问答