D3.jsプリファレンスパラメータ

チームプロジェクトのメイン画面で会員の好みや観光データを利用してデータを可視化するため、D 3.jsを試してみたいです.

D3.js(Data-Driven Documents)

は、データベースのドキュメントの略です.データをレンダリングできるJavaScriptベースのライブラリ、簡単なデータ可視化ライブラリ.D 3のコアライブラリはJavascriptとW 3 C DOM APIのみを転載できます.
D 3公式サイトには、ライセンスBSDによる営利、非営利のいずれも使用・修正可能なグラフが存在する.
D 3はHTML,SVG,CSSを用いてデータに活力を吹き込む.
要点:最新ブラウザの互換性を確保する

D3.js操作順序

1.データをロードします.
2.ワークスペースを選択します.
3.スペースにロードされたデータを接続(バインド)します.
4.つながっているものをすべて描きます.

D3.js操作プロセス

Loading-ロードするデータを視覚化する
Selecting-Binding-ビジュアル要素で入力データのコードと組み合わせて使用
Transform-グラフィックのタイプ、色、軸など、さまざまな要素を指定します.
Transition-クリックやドラッグなどのインタラクティブな効果を指定します.

SVG

scaleable Vector Graphics
Webベクトルグラフィックス、htmlドキュメントを直接埋め込み、埋め込むことができます.IE 8以外のすべてのブラウザでサポートされています.
利点:画像を編集でき、画質を損なわずにスケーリングできる

D 3 CDNの使用

誰もがインターネットを利用すればダウンロードしなくてもいいです.しかしいずれにしても、ネットが途切れることもあるので、選択するのは自分のことです.

<script src="https://d3js.org/d3.v5.min.js"></script>

D 3ライブラリのダウンロードを受信して使用

1.接続D 3主年齢

主下端d 3.zipをクリックしてダウンロード

受信したファイルをd 3というspringresourceフォルダに解凍します.jsファイルに追加します.フォルダ名はどれでもいいです.

HTMLドキュメントに次の内容を挿入します.

<script src="d3/d3.min.js"></script>