问题标签 [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.

0 投票
1 回答
130 浏览

chart.js - Chart.js 使用不同的标签操作图表中的每个条形图

有谁知道这是否可能?基本上我希望图表有标签,例如 [Jan, Feb, March],我希望能够打开和关闭这些值。看起来很简单,但事实证明是有问题的。

0 投票
1 回答
227 浏览

chart.js - 填充在我的 chartjs 折线图中不起作用

我正在使用最新版本的 chart.js (3.2.1)。如果我将其设置为正值,则填充有效。但是填充 0(或负值)不会将折线图完全设置在画布的边界处

画布位置正确

0 投票
1 回答
167 浏览

javascript - 如何使用 Charts.js 制作一维散点图?

我正在尝试使用 Charts.js 创建一维散点图。这是我能做的最好的:

我尝试一维散点图

我喜欢使用“线”并将其旋转 90 度的视觉效果。但是,我希望图表沿 Y 轴更小。我已经display: false在 Y 轴上设置了,并且还限制了它的范围从-0.10.1,那我还能做什么呢?

0 投票
1 回答
182 浏览

javascript - Chart.js V3.20 过滤图例标签不起作用

我有一个动态折线图,我正在使用 Chart.js 构建最多 19 个数据集。我动态地将数据输入数据集(效果很好)。我遇到的问题是,如果我的数据集少于 19 个,则这些未使用的数据集仍会显示图例。我曾经在选项列表中将此功能与 Chart.js 2.6.0 一起使用:

但这不再适用于 Chart.js 3.2.0。

有谁知道如何让这个功能与 Chart.js 3.2.0 一起使用?

这是我目前分配数据集的方式:

0 投票
1 回答
1962 浏览

chart.js - 数据标签未显示在 Chart.js 上

我正在尝试在我的 chart.js 顶部显示总金额;我正在尝试使用 datalabel 插件,但我不确定它为什么不显示标签,我没有收到任何错误,这是我的代码:

该图表显示了正确的信息,但标签根本没有显示。

0 投票
0 回答
40 浏览

reactjs - 在雷达标签中添加不同颜色的数值

我是chart.js 的新手。我需要帮助将数值添加到具有不同颜色的雷达图点标签。例如带有样式的雷达标签

  1. 标签颜色应为黑色。
  2. 数值应该是不同的预定义颜色(例如蓝色)。

顶点标签附近的值应该是预定义的颜色(例如蓝色) - 就像附加在图像中的颜色一样。

请随时提供不同的方法来实现此要求。在此先感谢您的帮助。

0 投票
1 回答
54 浏览

javascript - 字体大小不会改变 Chart.js 版本 3.2.1

尝试在 chart.js 版本 3.2.1 中更改条形图的字体大小。以下不起作用,到目前为止,我在网上找到的选项适用于不同的版本。如何更改以下条形图的字体大小。谢谢你。

0 投票
1 回答
24 浏览

chart.js - 此图上的画布折线图超出指定长度

为什么此图上的折线图会超出指定的长度。在这个演示中,我有一个折线图,虽然我将画布高度设置为 250,但它的高度自动增长到 2355。如何控制折线图的高度?谢谢你。

JS:

0 投票
0 回答
141 浏览

javascript - chart.js v3,扩展控制器或任何基类给出即:没有'new'就不能调用类构造函数BarController?

我在一个 gatsby + React 项目中,并直接使用 chart.js 库(即不是反应库)。每当我尝试从 chart.js 扩展基类时,都会出现以下错误:

TypeError:没有'new'就不能调用类构造函数BarController

我的代码是:

然后我用它:

但是,它总是给出错误。

有没有人认为这是一个盖茨比的事情?也许我需要以不同的方式导入 chart.js 子库吗?或者有没有人在覆盖基类的同时在 gatsby 项目中做 chart.js 的经验?

0 投票
1 回答
432 浏览

javascript - 在chart.js中更改图例框的颜色和x网格线的颜色

祝大家好日子:

最近我开始使用 Vue.js(2.6.12) + Vuetify(2.3.10) 和 Chart.js(3.0.2)。所以我是一个新手(再次)。

我创建了一个组件,它包装了 Chart.js 允许我们创建的条形图。这是它的图片:创建的组件

我要更改的唯一两件事是靠近图例标题的小框和一些网格 x 线。

在小图例框的情况下是红色的。我希望它与图例标题文本的蓝色对齐。正如我在这张照片中向您展示的那样:框和图例标题文本我想达到的结果

最后,我想在 X 轴上添加一些颜色(粉红色):

我无法做到这一点。我已经考虑并遵循了官方文档,但没有任何效果:S。

在图例标题框的情况下,我注意到它总是采用第一个元素的颜色。在轴的情况下,chart.js 支持的功能对我不起作用。它根本不打印 x 轴。

我尝试过的事情:

  • 升级到chart.js 3.3.0 但我收到这样的错误:“”我使用3.0.2 的原因是因为它是3.0.0 版本中唯一适用于我的版本。
  • 降级到 2.9.3/4。我无法更改框或轴线的颜色,但其余的工作正常。
  • 使用包装器:https ://vue-chartjs.org/ 。它没有用

整个组件的代码:

为了使用它,您应该:

  • 在部分中导入它
  • 在组件部分声明它
  • <NameOfComponetGiven/>通过标签调用它

任何帮助都会非常感激。非常感谢你。