1

ここで与えられた解決策によると:csvファイルにリンクされたテーブルの作成

コードのこの部分で何が起こるかわかりません:

var cells = rows.selectAll("td")
        .data(function(row) {
            return columns.map(function(column) {
                return row[column];
            });
        })

data() は配列「行」の各要素でループし、Array.prototype.map() は「この配列のすべての要素で提供された関数を呼び出した結果で新しい配列を作成する」ことを知っています。

return columns.map(function(column)、「列」とは正確には何ですか?

2 つの無名関数によって形成されるループについて、順を追って説明していただければ幸いです。

4

1 に答える 1

4

これはネストされた選択の例です。それを理解するには、データを行にバインドする前のコードについても考慮する必要があります。

このコードでは、前の呼び出しdata()で渡された配列の個々の要素をそれぞれ考慮するように関数に指示しています。data()

var rows = tbody.selectAll("tr")
    .data(data)
    ...

これらの各要素は順番に処理され、呼び出されrowます。内部の匿名関数はこの行を取得し、 の各要素について、特定の によって指定されたcolumns要素を取得します。rowcolumn

つまり、配列row内の要素と同じ名前のキーを持つ連想配列 (またはオブジェクト)columnsです。これらの要素を配列に抽出し、特定のセルmapのデータとして使用します。td

すべての内部処理の後、配列が渡されdata()ます。単一の配列要素が渡されましたが、配列が返されます。このようにして、行と列を含むテーブルを作成できます (これが、ネストされた選択を持つポイントです)。各tdセルにバインドされるのは、最も内側のセルがreturn返すものです。

特定の質問に答えるために、column変数はcolumns配列の各要素に順番にバインドされます。つまり、 の最初の繰り返しでは 、2 回目の繰り返しではmap()になります。columns[0]columns[1]

于 2013-03-16T12:09:53.103 に答える