问题标签 [chart.js2]

我正在为我的图表创建一个插件（在 ChartJS 2.2.2 中），为此我需要数据集每个点的像素位置。

检查时chart.config.data.datasets[0]._meta[0]，我得到以下对象：

但是当我直接在我的插件代码中访问 x 字段时，返回的值是不同的。命令：

chart.config.data.datasets[0]._meta[0].dataset._children[0]._model.x和 chart.config.data.datasets[0]._meta[0].data[0]._model.x（在 chrome 调试器中查找时产生相同的值）都返回x = 3而不是 44.67。

为什么会这样？访问数据集中某个点的像素坐标的正确方法是什么？

我需要使用 Chart.js 在 HTML 画布上移动垂直线。

我正在使用这个：

http://jsfiddle.net/dbyze2ga/377/但我需要的是在单击网页上的按钮时将该行移动到另一个索引。我阅读了有关 html 画布的信息，发现删除线是“不可能的”，但后来我发现：https ://jsfiddle.net/ombaww9t/2/并且线正在移动。

所以我需要的可能是这两个例子的组合。

感谢您的回复。

如何在 Chart.js v2 中将°C 添加到 Y 轴？这些值由 Chart.js 库自动生成。

这是我的代码：

经过大量的折腾和大量的咬牙切齿后，我有点/有点得到了一个与图例一起使用的饼图，如我的自动回答here所示。

但我仍然非常渴望一个更大的馅饼——它很容易再变大一半而不会超出它的界限，ISTM。我需要做什么才能扩大馅饼？

这是我正在使用的代码：

HTML

查询

...以及目前的情况：

更新

我做了一些修改，但仍然需要扩大尺寸；在这里得到了回答。

我可以使用 Chart.JS 创建一个“传统”条形图，甚至可以创建一个如下所示的堆叠条形图：

但我需要创建一个显示水平而非垂直的条形图，并在底部显示百分比，如下所示的这个示例是使用 xlsxwriter 创建的：

Chart.JS 如何被操纵来执行这个顺序的魔法？

更新

我将答案标记为正确，因为它显然有效，基于 jsfiddle。但是我无法将数据堆叠起来。这就是我所看到的：

这是我的代码：

我究竟做错了什么？

注意：我也试过这个：

...还有这个（系腰带和吊带）：

更新 3

这有效（我不得不剥离其中一个选项级别）：

我想在我的 Chart.JS 水平条形图中将字体更改为更时髦的字体。我尝试了以下方法，但没有一个有效：

我还读到这会起作用：

...但是这段代码会去哪里，它到底应该是什么样子？我试过这个：

...但也没有什么好效果。

对于完整的图片/上下文，这是构成此图表的所有代码：

HTML

查询

我什至试过这个：

CSS

HTML

...但我认为画布绘图会处理字体外观，因为添加它没有任何区别。

更新

我试过这个，它完全打破了它：

更新 2

正如 Matthew 暗示的那样，这有效（在任何特定于图表的脚本之前）：

我根据需要在悬停时获取数据值：

...但我也想在每个栏的顶部添加一个值，如下所示：

如何获取计算数据并将其嵌入到每个条中？

我的代码如下：

HTML

查询

更新

Dekel：你的答案非常接近——这就是我在代码不变的情况下看到的：

因此，不仅放置在栏上的值需要更靠右，我还需要像以前一样显示悬停数据（现在它被截断了一点，正如你在屏幕截图中看到的那样），而不是两个值在条形图的每个段上显示一个 % 值（这两个值中较大的 % 是两个数字的组合值）。

注意：这同样适用于另一个问题（事实上，只要我还有积分，我的所有问题）：我将奖励他们允许的最大积分数（500）。

更新 2

通过更改此代码：

...对此：

...我现在看到条上的数字右对齐（但是，当然，它们都是虚假/模拟值）。不过，悬停值仍然被截断，我不需要在每个条的末尾重复该值（“99.9%”）。

I'm displaying a pie chart and a bar chart, but my line chart, with the same type of code, does not display, and I wonder why. Here is my code:

HTML

JQUERY

我有一个看起来像这样的水平条形图：

...但是当我将它悬停时就像这样：

我试图阻止“悬停数据”显示如下：

...像这样：

...但两者都不起作用 - 无论如何都会显示皱缩的尖端。

如何防止悬停数据显示在 Chart.JS 中？

我有这段代码可以将数据添加到图表中：

我希望它被逗号化，以便“2755”显示为“2,755”等。所以我尝试了这个::

...但这几乎完全抹去了我的馅饼；馅饼本身是不可见的，尽管我添加的图例是可见的，尽管被破坏了。

这失败了，效果完全相同：

由于数据嵌入在画布中，我认为我不能应用一些简单的通用解决方案，但如果有，那就太好了；否则，有什么方法可以完成这种数值的逗号化？

更新

我想尝试 felipeptcho 的答案，但我不知道将该代码放在我所拥有的确切位置，即：

更新 2

它仍然无法正常工作；这是添加该代码后的样子：

这是没有新代码时的样子，悬停在香蕉上（显示“2755”，我想是“2,755”）：

简单地注释掉这个：

...将其恢复为以前的外观，但我仍然没有逗号化的值，当然。

这是我打破馅饼的代码（当上面的代码没有被注释掉时）：

更新 3

等一下——我更新了上面的最后一张截图，没有真正注意它的外观，它已经被修复了。正如felipeptcho所提到的，它所要做的就是添加这一行：

没有它，值不包含逗号；有了它，他们就可以了——不需要其他任何东西！