仅以一种颜色呈现的 D3 饼图

Question

我正在使用 D3 库构建饼图。除了颜色，一切都很顺利。数据以普通对象格式存储。

我将颜色变量定义为：

    var color = d3.scaleOrdinal()
            .range(d3.schemeCategory10);

我的输入选择绑定代码是：

        var g = svg.selectAll("path")
              .data(pieArcs, keyField)
              .style("fill", function(d) { return color(d.data.key); });

        var g2 = g
            .enter()
            .append("path")
            .each(function(d) { this.dPrevious = d; })
            .style("fill", function(d) { return color(d.data.key); })
            .attr('fill', d => color(d.data.key))

各方面都改了，查了所有的D3饼图例子，到网上查了下，只搞到这个（其他都正常）：

我只需要用不同颜色区分每条弧线即可。

Answer 1

正如@adelriosantiago 指出的那样，d.data.key 不工作。我终于用 attr

给饼图上色了

.attr("fill", d => color(keyFieldFunction(d.data)));

当 keyFieldFunction 在代码中定义为：

var GUPkeyField = function(d){return d.data.key};

仅以一种颜色呈现的 D3 饼图

D3 pie chart rendering in only one color

javascript

charts

d3.js

pie-chart