d3.js学習ノート(未完待機)

1496 ワード

d3.jsはjQueryと同じチェーン文法です.
d3.jsの一般的な方法:
1. d3.select():CSSセレクタ構文を使用してDOMから単一要素を選択します.
 :d3.select("body");

2. d3.selectAll():要件を満たすすべての要素を選択します.
 :d3.select("body").selectAll("p");//  body    p  

3. selection.append():要素を作成し、選択セットの末尾に追加します.
 :d3.select("body").append("p");//  p  ,    body         

4. selection.text():テキストの内容を設定します.
 :d3.select("body").append("p").text("New");// p        

5. selection.data():DOM要素にデータをバインドし、数値はDOM要素の__に格納します.data__属性
 :d3.select("body").selectAll("p").data(dataset);

6. selection.Enter():新しいバインドデータの要素を作成する場合に使用する必要があります.まずDOMをチェックし、次にDOMにデータを渡します.数値が対応するDOM要素より多い場合、新しい占有要素を作成し、リンクを下に渡します.
 :d3.select("body").selectAll("p").data(dataset).enter().append("p").text("New paragraph!");

7. selection.スタイル():CSSスタイルを変更する
d3.select("div").style("height", “10px”);

8.attr():HTML属性値を変更する方法
d3.select("div").attr("class", "bar");

9. selection.classed():要素からクラスをすばやく適用または削除する方法
d3.select("div").classed("bar", true);

上の関数は私が例を勉強するときによく使う関数です.より多くの関数は、d 3の公式API検索を参照することができる.