d3.js - 從2維數組創建HTML表，但不包括第一個內部數組？

Question

這裏有一個的jsfiddle：http://jsfiddle.net/pingin/W7Zwg/

我有一個靜態的2維數組是這樣的：

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

我想創建此數組中的表，但我要排除的第一內陣列[「一「，」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的演示。