如何使用d3js为水平图表的路径应用颜色？

Question

我正在尝试创建水平图表以一次性填充多年数据以通过可视化表示来识别问题但是在代码下方无法正常工作，请帮助纠正它，类似的代码在本文的第2部分中有效。

[1]如何使用d3js为地平线图的路径应用颜色？

data=[0.2,1.3,1.1,1.3.0.9]

        var color =
            d3.scale.threshold()
                .domain([0,1])
                  .range(["green", "yellow", "red"]);       
        path.enter().append("path")
                    .style("fill", function (d,i) { return color(i);})
                    .attr("transform", t0)
                    .attr("d", d0);
d3.transition(path)
.style("fill", function(d,i) { return color(i); })
    .attr("transform", t1)
    .attr("d", d1);

[2]然而同样适用于以下代码：

var color = d3.scale.threshold()
      .domain([7, 9])  
      .range(["green","yellow","red"]);  

    var svg = d3.select('body')
        .append('svg')
        .attr('width',500)
        .attr('height',200);

    svg.selectAll('rect')
        .data(d3.range(10))
        .enter()
        .append('rect')
        .attr('x',function(d,i) { return i * 40; })
        .attr('y',30)
        .attr('width',30)
        .attr('height',30)
        .attr('fill',function(d,i) { return color(i); });