Javascript D3,迭代对象,在同一容器中创建多个饼图

Javascript D3,迭代对象,在同一容器中创建多个饼图,javascript,d3.js,Javascript,D3.js,我有一些用于创建许多图表的数据。我正在使用d3.nest创建一个键,以便按日期组织图表。除了我无法让pie函数在正在创建的2个示例对象上迭代之外,其他一切似乎都正常工作 以下是代码片段: var data1 = [ {"date":"June2013", "type":"coal", "total":20, "color": "purple", "lat": 100, "long": 100}, {"date":"June2013", "type":"wind", "total"

我有一些用于创建许多图表的数据。我正在使用d3.nest创建一个键,以便按日期组织图表。除了我无法让pie函数在正在创建的2个示例对象上迭代之外,其他一切似乎都正常工作

以下是代码片段:

var data1 = [
    {"date":"June2013", "type":"coal", "total":20, "color": "purple", "lat": 100, "long": 100},
    {"date":"June2013", "type":"wind", "total":30, "color": "blue", "lat": 100, "long": 100},
    {"date":"June2013", "type":"nuclear", "total":40, "color": "yellow", "lat": 100, "long": 100},
    {"date":"July2013", "type":"coal", "total":50, "color": "purple", "lat": 500, "long": 200},
    {"date":"July2013", "type":"wind", "total":60, "color": "blue", "lat": 500, "long": 200},
    {"date":"July2013", "type":"nuclear", "total":70, "color": "yellow", "lat": 500, "long": 200}
];

  var energyT = d3.nest()
  .key(function(d) { 
      return d.date; 
  })
  .entries(data1); 

var arc = d3.svg.arc()
        .innerRadius(40)
        .outerRadius(50);

var pie = d3.layout.pie()
        .value(function (d){
            return d.total;
        });
        //console.log("what is the length of energyT: " + energyT.length)
        //printout:  what is the length of energyT: 2
        //it knows there are 2 objects
var arcs = svg.selectAll("arc")
        //.data(pie(energyT[0].values))
        .data(function (d, i){
            //console.log("what is i: " + JSON.stringify(energyT[i].values))
            //printout:  what is i: [{"date":"June2013","type":"coal","total":20,"color":"purple","lat":100,"long":100},...
            //it correctly passes the values of the first object 
            //but it doesn't iterate to the next
            return pie(energyT[i].values);
        })
        .enter()
        .append("svg:g")
        .attr("transform", function(d){
            return "translate(" + d.data.lat+ "," + d.data.long + ")"
        });

      arcs.append("path")
        .attr("d", arc)
        .attr("fill", function (d) {
            console.log("what is d in color " + JSON.stringify(d.data.color))
                return d.data.color;
    });
});

另外,如果我向它传递一个精确的索引(.data(pie(energyT[0].values)),它将绘制该图表。我不知道如何迭代这两个对象。任何建议都将不胜感激。

我能够让它读取有两个对象。我还需要在函数中传递energyT,如下所示:

.data(energyT, function (d, i){
            return pie(energyT[i].values);
        })
这部分问题解决了,现在我无法让它画任何圆弧,因为路径值无效。奇怪的是,我可以在不使用d3.nest创建键值的情况下传递数据,但一旦我添加键值,即使这些值看起来传递正确,它也不再起作用

我最初的问题已经解决了