是否可以在 Chart JS 的圆环图中添加更多属性来细分？

【问题标题】：Is it possible to add more attributes to segement in a Doughnut chart of Chart JS?是否可以在 Chart JS 的圆环图中添加更多属性来细分？
【发布时间】：2016-03-23 18:23:41
【问题描述】：

在初始化圆环图（或任何其他图表）时，是否可以为每个段添加更多属性？目前，我们正在为四个属性设置值——值、颜色、高亮和标签。我想在初始化图表数据时添加更多属性，以便在单击图表并调用 getSegmentsAtEvent(e) 函数时能够检索这些属性。

【问题讨论】：

标签： javascript jquery charts chart.js

【解决方案1】：

只需将它们添加到您的数据中

var data = [
    {
        value: 300,
        color:"#F7464A",
        highlight: "#FF5A5E",
        label: "Red",
        extra: 1
    },
    ...

创建图表后，将其添加到图表元素中

...
var myChart = new Chart(ctx).Pie(data);

myChart.segments.forEach(function(segment, i){
   segment.extra = data[i].extra
})

以及使用元素访问它

canvas.onclick = function(evt){
    var activeSegment = myChart.getSegmentsAtEvent(evt);
    alert(activeSegment[0].extra)
};

只需单击一个部门即可在此处查看它的运行情况

小提琴 - http://jsfiddle.net/aswfsyxw/

【讨论】：

非常感谢。我错过了该过程的第二步 - 初始化图表后设置新属性值。这就是为什么我在步骤 3 中访问属性时得到“未定义”值的原因。