Javascript D3.js为带内环的圆环图提供图例

我正在尝试将一个正确标记的图例添加到带有多个环的甜甜圈图表中。我这里有plunker的更新代码：

以下是我用于添加图例的代码：

 var legend = chart1.selectAll(".legend")
     .data(color.domain().slice())//.reverse())
     .enter().append("g")
     .attr("class","legend")
     .attr("transform", function(d, i) { return "translate(0," + i * 20 + ")"; });

legend.append("rect")
    .attr("x", 190)
    .attr("y", -(margin.top) * 7 - 8)
    .attr("width", 18)
    .attr("height", 18)
    .style("fill", color);

legend.append("text")
    .attr("x", margin.right * 7)
    .attr("y", -(margin.top) * 7)
    .attr("dy", ".35em")
    .text(function(d,i) { return d; });

正如您在图表上所注意到的，图例编号从0到5，但我希望图例根据绘制图表所用的类别进行标记，例如A类、B类

---

请协助在

d3

中，函数的第二个参数是元素的索引。因此，您可以使用此索引直接从数据数组中获取任何属性

例如

数据[0]->

{“类”：“A类”，“实际类”：“495”，“预测类”：“495”，“准确度”：“100”}

所以试试这个代码

legend.append("text")
      .attr("x", margin.right * 7)
      .attr("y", -(margin.top) * 7)
      .attr("dy", ".35em")
      .text(function(d,i) { 
         return data[i].Class; 
       });

---

在答案中添加了细节。希望这有帮助。我现在明白了。再次感谢：）如果我想在每个弧中添加文本，并将其各自的实际值和预测值添加到弧中，我该怎么做？我已经更新了question@Gbenro“Skenzy”seller实际上，它应该作为一个新问题添加，而不是编辑问题。请添加一个新问题并给我url。好的。新的问题是：