D3.js 从d3.layout.pie（）中的数据向圆弧添加类名

我正在从JSON文件创建一个饼图。我想知道是否有一种方法可以从JSON文件中获取一些名称，并将它们指定为由d3.layout.pie（）创建的弧的类名

以下是我创建的一个示例：

基本上，我想做一些类似下面最后一行代码的事情：

var data = [
  {
    'name': 'apple',
    'value': 250
  },
  {
    'name': 'banana',
    'value': 100
  },
  {
    'name': 'orange',
    'value': 150
  }
];

var arcs = svg.selectAll('g.arc')
              .data(pie(data.map(function(d) { return d.value; })))
              .enter().append('g')
              .attr('transform', 'translate(70, 70)')
              .attr('class', function(d) { return d.name; };

但是，由于数据已由pie（）转换，我想知道是否有必要向pie（）生成的数据中添加类名

---

谢谢

一些D3布局改变了原始数据集，但其他布局创建了新数据集（如voronoi）。在这些情况下，在使用新数据集时，可以使用原始数据集中的数组位置。从你的例子来看：

var arcs = svg.selectAll('g.arc')
          .data(pie(data.map(function(d) { return d.value; })))
          .enter().append('g')
          .attr('transform', 'translate(70, 70)')
          .attr('class', function(d,i) { return data[i].name; };

---

一些D3布局改变了原始数据集，但其他布局创建了一个新数据集（如voronoi）。在这些情况下，在使用新数据集时，可以使用原始数据集中的数组位置。从你的例子来看：

var arcs = svg.selectAll('g.arc')
          .data(pie(data.map(function(d) { return d.value; })))
          .enter().append('g')
          .attr('transform', 'translate(70, 70)')
          .attr('class', function(d,i) { return data[i].name; };

---

d3的布局提供了一个有用的方法，允许您指定如何获取基准值，而不是执行data.map（）操作。因此，你可以：

var pie = d3.layout.pie().value(function(d) { return d.value; })

这样，原始数据将保留在d数据中

因此，使用pie的定义，您的代码将更改为：

var arcs = svg.selectAll('g.arc')
          .data(pie(data))
          .enter().append('g')
          .attr('transform', 'translate(70, 70)')
          .attr('class', function(d) { return d.data.name; };

---

编辑：添加了相关文档的链接。

d3的布局提供了一个有用的链接，允许您指定如何获取基准值，而不是执行data.map（）操作。因此，你可以：

var pie = d3.layout.pie().value(function(d) { return d.value; })

这样，原始数据将保留在d数据中

因此，使用pie的定义，您的代码将更改为：

var arcs = svg.selectAll('g.arc')
          .data(pie(data))
          .enter().append('g')
          .attr('transform', 'translate(70, 70)')
          .attr('class', function(d) { return d.data.name; };

---

编辑：添加了相关文档的链接。

非常感谢您的回答！这就是我最初想要的。非常感谢你的回答！这就是我最初想要的。