颜色无法正确渲染饼图d3

时间:2016-03-16 00:13:53

标签: javascript d3.js charts

我今天在D3上制作一张饼图(好玩!)。

好吧,我遇到的问题是颜色没有正确分配。

这是jsfiddle:

https://jsfiddle.net/zh34ud25/5/

大多数(?)相关代码:

var color = d3.scale.ordinal()
  .range(["#71b2b9", "#dcdcdc"]);

color.domain(d3.keys(dataUnbilledRevenue[0].values[0]).filter(function(key) { 
  if (key === 'Unbilled_Revenue'
   || key === 'Billed_Revenue') {
      return key
  }
}));


// This returns the data into two separate objects which can be graphed.
// In this case, Amount and Quantity.
var datasets = color.domain().map(function(name) {
  return {
    name: name,
    values: dataUnbilledRevenue.map(function(d) {
      return {
        Value: +d.values[0][name]
      };
    })
  };
});

1 个答案:

答案 0 :(得分:1)

这很简单,这样做会使颜色变为饼图:

   pieValues.append("path")
      .attr("d", arc)
      .attr('class', 'pie-point')
       .style("fill", function(d) {
         return color(d.data.name)

       })

工作代码std::errc