Chartist 的饼图标签错位，我无法调试它

Question

我正在尝试使用从某些 php 页面获取的 Json 数据制作图表。

具体来说，我想显示一个饼图，其中带有每个部分的标签以及它所代表的百分比。

我按照图表师的例子，最终得到了这个代码笔：

https://codepen.io/orsucciu/pen/qBdrjow

标签小，错位，百分比不显示！

我检查了调试控制台，但没有出现任何问题。

我还在我的 LabelInterpolation 中添加了一个 console.log 来查看，但它没有发送任何东西......所以我怀疑它来自那里，但我不知道到底是什么问题:(

谢谢！

Answer 1

https://codepen.io/SkyDieRay/pen/BaNWdmr

data = JSON.parse('{"orphans":17,"0":4,"1":7,"3":1,"aTraiter":2,"aValider":3,"Valided":4,"retourBO":5}');

我玩了一下，你的错误值显示在那里，因为图表中的数据为 0%，因此所有这些都在同一个地方。
我更改了数据以赋予它们值，现在看起来很正常。

为了显示百分比，我将其添加到响应选项中。
此外，将值替换为 dat.series[index]。值只是数据的键，而不是值。所以你大部分时间都在跳弦，这就是为什么你在那里得到 NaN% 的结果。

labelInterpolationFnc: function(value, index) {
  var percentage = Math.round(dat.series[index] / dat.series.reduce(sum) * 100) + '%';
  return dat.labels[index] + ' ' + percentage;
}

Chartist 的饼图标签错位，我无法调试它

Chartist's pie labels are misplaced, and i can't debug it

javascript

charts

json

chartist.js