d3.js - 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", "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

最初の行は、キー関数とは関係なく、常にデータにバインドされているようです。私は何を間違っていますか？

どうもありがとう、

デビッド