问题标签 [chart.js3]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
vuejs3 - Vue 3 中的一页上的多个图表
期望的结果
在单个页面上显示相同图表类型的多个实例。示例图像包含从下面的代码中剥离的附加数据。
初始图表画布对象是使用Chart.vue组件创建的：
图表选项和数据当前建立在“图表类型”组件中，在这种情况下是组合的条形图和折线图BarLine.vue（其他图表类型还有其他组件）。尽管此处提供了数据，但数据最终将来自外部。
然后图表对象显示在Home.vue（最终App.vue）：
我试过的：
控制台报告“画布已在使用中。在重新使用画布之前，必须销毁 ID 为‘0’的图表”。我试过的：
- 多次不同的尝试在调用之间破坏画布。
- 为每个组件创建唯一的图表 ID。
- 重复的图表类型组件。
- 将
Chart.vue代码移动到图表类型组件 Vue 文件中。 - 制作显示的不同类型的第二个图表对象。
javascript - Chart.js 版本 3 编译错误：您可能需要适当的加载程序来处理此文件类型
当我调用npm run start运行我的反应应用程序时，我得到一个编译错误：
这是我使用它的方式：
我在这里发现了问题chart.js- 第三行 - 但我不是一个 javascript 开发人员，所以我不知道问题是什么：
我确实看到了另一个具有相同错误的 SO 帖子 - Chart.js 错误：您可能需要适当的加载程序来处理此文件类型- 但列出的解决方案对我不起作用 - 我没有使用 babel 或 webpack我知道并且我真的很想使用 Chart.js 版本 3 而不是版本 2。
这是我的package.json：
我在用着：
- 节点版本 17.1.0
- NPM 版本 8.1.2
如果有人可以向我解释那段代码的问题是什么，我很乐意为该项目提交 PR——在我看来，它就像普通的 JavaScript。
chart.js - Chartjs v3 与组重叠堆积条形图
我想用使用 chart.js v3 的组创建堆积条形图。我
我做到了，我得到了以下图像。但是在这里，不是标签1和标签2的总和显示为7000，而是如何从x轴开始将标签1和标签2的交集一起显示为4000。
javascript - 如何使用 Chart.js 3.+ 上的缩放和平移在我的图表数据集上显示特定数据范围？
我有一个关于 x 天/月发送的消息的折线图，我还有两个日期选择器。我希望能够选择开始日期、结束日期，并且图表会读取这些日期并显示这个精确的点范围。我已经在我的 chart.js 文件上配置了缩放和平移，我可以手动完成，但我想知道如何通过我刚才描述的内容来做到这一点。
在这张照片上，我已经有 3 个月的数据了。它总是开始显示 1 个月。
javascript - chart.js 版本 3 - 如何制作重叠条形图？
是否可以使用 Chart.js 版本 3 创建这样的图表（下图）？
任何建议将不胜感激。
reactjs - 在使用 react 实现 chart.js 折线图时单击年份时图表值不会改变
在 react 中，使用 chart.js，从服务器检索的数据显示为折线图。
当您单击图表顶部的年份按钮时，将从服务器检索该年份的数据并再次显示在图表上。
我试图在带来数据时使用 setState 更改值，但它不会改变。
**chart.js 是使用 cdn 导入的。
在sendYearData函数中，我需要用我从服务器获取的数据来更改图表数据，但它不起作用。
reactjs - 在 react 中使用 chart.js 时没有出现图例
我正在使用 react chart.js 按年创建销售图表。
当点击年份按钮时，会从服务器端取来对应的年份数据，并更新图表数据。
但是，chart.js 折线图示例中看到的上半部分的图例没有出现。
在示例中，当您单击顶部图例时，图表会被隐藏和显示，因此该功能必不可少。
请让我知道下面的代码有什么问题
如果新图表在 componentDidMount() 的 getOrderList() 之外，则图例可见。但是当这种情况发生时，我无法将我的数据放入图表中。
所以似乎新的图表（）必须在那个时候。
我想被这样展示
但现实
javascript - chart.js API 返回错误的 x 和 y 点
我通过chart.js API调用我的bubbleChart并尝试访问点的x，y值但我得到了这个非常奇怪的行为
当我访问 object.x 或 object.y 时，即使在控制台中，我也会得到每个点的 350.017 和 537.199，它显示 x,y 的值正确。到底是怎么回事？
当然我也试过这个，但同样的结果
这是显示奇怪行为的小提琴 console.log 总是为不同的端点显示相同的数据，但是如果你输入控制台 bubbleChart._metaset 它会显示正确的 x,y 值
canvas - 如何更改 Chart.js 中 Y 轴上的网格线样式？
我正在使用Chart.js版本3.7.0来绘制图表。
我使用以下代码创建了一个类似于图像的图形。我只想将红框中的线表示为基于Y轴的法线。
我已经尝试使用callback()或查找并应用 a plugin，但它并没有给我想要的结果。我应该如何添加代码？