1

我无法返回数组长度。我有一个数组如下：

var colorsquares = [
                [3.3, 28, -1.5, 13, 857, 3, 5, 6, 7, 5, ["#b2dbbb","#d2e6c1"]],
                [1.3, 18, -1.5, 13, 857, 3, 5, 6, 7, 5, ["#c2dccc","#d2fdc1"]]
                ];

我正在使用最后一个值来为 div 着色

d3.select("#colorBox")
          .selectAll("div")
          .data(d[10])
          .enter()
          .append("div")
          .style("background-color", function(d) { 
               return d; 
           })
           .style("width", function(d) { 
               return (d.length + 1) + "px"; 
           })
           ;

颜色出来了，但我没有得到我想要的宽度。我得到的是 8 而不是 2。

4

1 回答 1

1

在 D3 样式函数中：

.style("width", function(d) { 
    return (d.length + 1) + "px"; 
})

，第一个参数（您称之为d）表示单个数组元素，例如"#b2dbbb"或"#d2e6c1"。D3 将第一个数组元素 ( "#b2dbbb") 传递给 first div，将第二个 ( "#d2e6c1") 传递给 second div，依此类推。因此，当您要求 时d.length + 1，您要求的是字符串的长度"#b2dbbb"+ 1，实际上是 8。

我认为您的困惑是因为您将该名称d用于两个不同的目的，一个是隐藏另一个。您将它用作函数中的参数，但也用作对colorsquares[0]or的引用colorsquares[1]（这些是在某种循环中还是什么？我不能更具体，因为您还没有发布所有代码。）

例如，将 OUTER d（当您说 时所指的那个.data(d[10])）更改为被调用dd（或更好的名称，理想情况下）。然后，在背景颜色功能中你说得对

return d

但是在宽度函数中，我认为您正在寻找

return (dd[10].length + 1) + "px";
于 2013-11-06T13:29:45.723 回答