Javascript d3分组条形图创建问题

我想使用d3创建一个分组条形图，但我看到的所有示例都有不同的数据格式，我无法确定如何使用我的数据格式绘制图表

例如：

以下是我的数据：

var data =[
{
  "data": [
    [
      "2016-01-21T01:20:00.000Z",
      1.41818181818182
    ],
    [
      "2016-01-21T02:28:00.000Z",
      1.90661764705882
    ],
    [
      "2016-01-21T03:36:00.000Z",
      1.66764705882353
    ],
    [
      "2016-01-21T04:44:00.000Z",
      1.51691176470588
    ],
    [
      "2016-01-21T05:52:00.000Z",
      1.40955882352941
    ],
    [
      "2016-01-21T07:00:00.000Z",
      1.46323529411765
    ],
    [
      "2016-01-21T08:08:00.000Z",
      1.48308823529412
    ],
    [
      "2016-01-21T09:16:00.000Z",
      1.89384615384615
    ]
  ],
  "label": "a"
},
{
  "data": [
    [
      "2016-01-21T01:20:00.000Z",
      4.98701298701299
    ],
    [
      "2016-01-21T02:28:00.000Z",
      5.0
    ],
    [
      "2016-01-21T03:36:00.000Z",
      4.94852941176471
    ],
    [
      "2016-01-21T04:44:00.000Z",
      4.91176470588235
    ],
    [
      "2016-01-21T05:52:00.000Z",
      4.81617647058824
    ],
    [
      "2016-01-21T07:00:00.000Z",
      5.0
    ],
    [
      "2016-01-21T08:08:00.000Z",
      4.94117647058824
    ],
    [
      "2016-01-21T09:16:00.000Z",
      4.96969696969697
    ]
  ],
  "label": "b"
}
];

因此，请帮助我使用我的数据格式创建分组条形图

到目前为止我写的代码是：

而不是这个：

   .attr("height", function(d) {
        return y(d[1]); //Note this is returning data
      })

应该是

 .attr("height", function(d) {
    return height - y(d[1]); //Note this is returning data
  })

您还没有制作另一个标尺来定位钢筋，因此钢筋一根接一根

var x1 = d3.scale.ordinal();
x1.domain(data.map(function(d){return d.label})).rangeRoundBands([0, x.rangeBand()]);

然后，在组中，您需要进行如下变换，以对齐a条和b条：

  .attr("transform", function(d,i) { 
    var r = parseFloat(x1(d.label));
    if (r == 0){
      r = r-5;
    }
    return "translate(" +  r  + ",0)"; 

  })

工作代码

---

希望这有帮助

谢谢你的解决方案。请问你为什么要减去5？如果不是2条数据，而是我给出数据来创建3条，那么代码在这种情况下也会工作吗？