データビジュアライゼーションのためのＤ３．ｊｓ徹底入門―Ｗｅｂで魅せるグラフ＆チャートの作り方

古籏 一浩【著】

ＳＢクリエイティブ（2014/06発売）

• サイズ B5判／ページ数 464p／高さ 24cm
• 商品コード 9784797368864
• NDC分類 007.64
• Cコード C0055

出版社内容情報

Web上でデータをビジュアルに表現しよう！

データ可視化のためのJavaScriptライブラリ「D3.js」の使い方を豊富な作例を通して解説。D3.jsの基本、各種外部データの読み込み、棒グラフ、円グラフ、散布図など様々なグラフの作成、アニメーションの実装、地図データとの連携まで使いこなしの情報が満載！

第1章 D3.jsとは何か
1-1 D3.jsとは何か
1-2 D3.jsで作成できるグラフ
1-3 本書で使用するJavaScript
1-4 D3.jsの機能（オブジェクト）
1-5 メソッドチェーンとは
1-6 開発のために必要なツール

第2章 D3.jsの基本――D3.jsでグラフを描く
2-1 D3.jsの基本的な流れ
2-2 D3.jsを使って横棒グラフを表示する
2-3 データを変更する
2-4 グラフをアニメーションさせる
2-5 マウスイベントでグラフの色を変化させる
2-6 外部のデータを読み込む
2-7 目盛りを表示する
2-8 すべての機能をまとめる

第3章 SVGの基本
3-1 SVGとは何か
3-2 基本図形を描画する（四角形、円）
3-3 パスを描画する
3-4 図形のスタイルを指定する
3-5 文字を描画する
3-6 グループと図形の移動

第4章 D3.jsからSVGを操作する
4-1 D3.jsでSVG図形を生成する
4-2 図形の位置やサイズを指定する
4-3 図形のスタイルを指定する
4-4 複数の図形を操作する

第5章 様々な形式のファイルからデータを読み込む
5-1 プログラム内に用意された単純な配列データの場合
5-2 TSV形式（タブ区切りテキスト）のファイルを読み込む場合
5-3 CSV形式（カンマ区切りテキスト）のファイルを読み込む場合
5-4 JSON形式のファイルを読み込む場合
5-5 HTML形式のファイルを読み込む場合
5-6 XML形式のファイルを読み込む場合
5-7 読み込むファイルがプレーンテキストの場合

第6章 データの更新・追加・削除
6-1 D3.jsにおけるデータと要素の対応
6-2 データの追加と更新
6-3 データの削除

第7章 縦棒グラフ
7-1 縦棒グラフを生成する
7-2 グラフ内に数値を表示する
7-3 グラフに目盛りを表示する
7-4 グラフを汎用化する
7-5 グラフをアニメーションさせる
7-6 マウスイベントでグラフを変化させる
7-7 CSVファイルからデータを読み込み、縦棒グラフを表示する

第8章 円グラフ／パイチャート
8-1 円グラフの生成
8-2 円グラフの色分け
8-3 円グラフをアニメーションしながら表示する
8-4 円グラフに数値とテキストを表示する
8-5 外部ファイルを読み込み、円グラフを変化させる

第9章 折れ線グラフ
9-1 折れ線グラフの生成
9-2 複数の折れ線グラフを表示する
9-3 折れ線グラフを直線、曲線、階段状に表示する
9-4 複雑なデータを処理し、折れ線グラフを表示する
9-5 データセットの日付と対応させる
9-6 ボタンクリックでグラフの表示範囲を変更する

第10章 散布図
10-1 散布図の生成
10-2 データをアニメーションさせながら表示する
10-3 データに応じて目盛りを調整する
10-4 グリッドを表示する
10-5 ツールチップを表示する
10-6 CSVファイルのデータから散布図を表示する
10-7 データの範囲に応じてグラフを調整する

第11章 ヒストグラム
11-1 ヒストグラムの生成
11-2 ヒストグラムの表示データ範囲を指定する
11-3 CSVファイルのデータからヒストグラムを表示する

第12章 パックレイアウト
12-1 パックレイアウトの生成
12-2 パックレイアウトで人口を表示する
12-3 外部ファイルを読み込み、パックレイアウトで表示する

第13章 ツリーマップレイアウト
13-1 ツリーマップの生成
13-2 フォルダ内にあるファイルサイズに応じてレイアウトする
13-3 使用されている文字数をカウントして表示する

第14章 ヒートマップ
14-1 ヒートマップの生成
14-2 ヒートマップをCanvasに表示する
14-3 ヒートマップをDOMに表示する
14-4 外部ファイルからデータを読み込み、ヒートマップを表示する

第15章 地図／マップレイアウト
15-1 D3.jsで扱えるマップの種類
15-2 世界地図を表示する
15-3 地球を表示する
15-4 日本の地図データを使用する

付録 431
A-1 フォースレイアウト
A-2 積み上げ棒グラフ
A-3 ツリーレイアウト
A-4 鶏頭図
A-5 グラフをソートして表示する
A-6 フィッシュアイプラグインを利用する
A-7 サーバーのログを読み出しOSのシェアを円グラフで表示する

内容説明

Ｗｅｂで魅せる「グラフ＆チャート」の作り方。データ＋マッピング＋デザインで作りだす新しいＷｅｂの表現力。グラフ描画のための高機能ＪａｖａＳｃｒｉｐｔライブラリ「Ｄ３．ｊｓ」の基本的な使い方、データの読み込み、アニメーションの実装まで豊富な作例を通して丁寧に解説。

目次

Ｄ３．ｊｓとは何か
Ｄ３．ｊｓの基本―Ｄ３．ｊｓでグラフを描く
ＳＶＧの基本
Ｄ３．ｊｓからＳＶＧを操作する
様々な形式のファイルからデータを読み込む
データの更新・追加・削除
縦棒グラフ
円グラフ／パイチャート
折れ線グラフ
散布図〔ほか〕

感想・レビュー

※以下の感想・レビューは、株式会社ブックウォーカーの提供する「読書メーター」によるものです。

[choasia]

コード内のコメントが丁寧に書かれている為、分かりやすかった。しかし、後半はやや冗長で、もっとコンパクトになって欲しかった。

2015/09/23