Question

这是一个JSFiddle：http://jsfiddle.net/pingin/W7Zwg/

我有一个像这样的静态二维数组：

var testData = [
    ["a","a","a","a"],
    ["b","b","b","b"],
    ["c","c","c","c"],
    ["d","d","d","d"]
]

我想从这个数组创建一个表，但我想排除第一个内部数组[“a”，“a”，“a”，“a”]（让我们说因为它包含头信息）。所以我有以下代码：

// first create the table rows (3 needed)

var tr = d3.select("#results").append("table").append("tbody").selectAll("tr")  
        .data(testData, function(d,i){
        if (i > 0 ) {   // don't need the first row
            return d;  
        }
        })
        .enter()
        .append("tr");


// Now create the table cells

var td = tr.selectAll("td")
        .data(function(d) {return d; })
        .enter()
        .append("td")
        .text(function(d) {return d;});

在此之后我期待看到的是一个或多或少像这样的表：

b b b b
c c c c
d d d d

相反，我得到的是：

a a a a
b b b b
c c c c
d d d d

如果我改变了初始数据绑定中的条件：

if (i > 0 ) {   // don't need the first row

到：

if (i > 1 ) {   // don't need rows 1 or 2

然后得到的表是：

a a a a   
c c c c
d d d d

如果我将条件改为：

，那么看起来仍然很奇怪

if (i === 3 ) {   // just take the last row

结果是：

a a a a   
d d d d

第一行似乎总是绑定到数据，与键功能无关。我做错了什么？

非常感谢，

大卫

Answer 1

试试这个：

var tr = tbody.selectAll("tr")  
        .data(testData.filter(function(d,i){
        if (i > 0 ) {   // don't need the first row
            return d;  
        }}))
        .enter()
        .append("tr");

Here是演示。

d3.js - 从二维数组创建HTML表但排除第一个内部数组？

1 个答案: