6

ヒストグラムなどの再利用可能なグラフの例には、次のものがあります。

// select the svg element, if it exists
var svg = d3.select(this).selectAll("svg").data([data]);

// append the svg element, if it doesn't exist
svg.enter().append("svg") ...

...ここthisで、は現在のDOM要素であり、dataはそれにバインドされているデータです。私が理解しているように、このイディオムでは、チャート関数が最初に呼び出されたときにチャートを作成できますが、必要に応じて、後続の呼び出しに続いて「再作成」することはできません。しかし、誰かがこのイディオムを詳細に説明できますか？例えば：

  • なぜ.selectAll("svg")使用され、使用されないの.select("svg")ですか？
  • .empty()空の選択をチェックするために使用されないのはなぜですか？
  • 任意の単一要素配列をに渡すことはできます.data()か？（この配列の目的は、単に入力選択を返すことだと思います。）

助けてくれてありがとう。

4

1 に答える 1

7

これが初めて呼び出されるときは、SVG がないため、.enter()選択には渡されたデータが含まれます。後続の呼び出しでは、.enter()選択は空になるため、新しいものは何も追加されません。

具体的な質問について：

  • .selectAll()は、 に渡された配列と照合できる配列を返します.data()。
  • .empty()使用できますが、必須ではありません。選択範囲が空の場合は何も起こりません。チェックするとステートメント.empty()が追加され、ifまったく同じ効果があります。
  • はい。選択の詳細については、たとえばこのチュートリアルをご覧ください。
于 2012-12-27T23:44:56.210 に答える