【D3.js】グラフと地図を連動させる

最終更新日

散布図上でドラッグすると、選択した範囲の都道府県に色が付きます。
jpanmap20140221

d3.svg.brushを使って、散布図と地図を連動させるサンプルを作成しました。

example

データセットの作成

有効求人倍率と充足率の情報は「社会生活統計指標」より。
都道府県の地図データは以下よりいただきました。
都道府県色塗り用shapeファイル(英語表記)

社会生活統計指標からダウンロードした「労働」統計表をExcel上で編集してcsvに。
作成したcsvと都道府県色塗り用shapeファイルをQuantum GISに読み込み結合。(結合の方法は以下を)
属性データにCSVまたはDBFファイルを結合したい

結合したデータをgeojsonで出力し、さらにtopojsonに変換します。
topojsonへの変換は「TopoJSONを使う」を参照してください。
出来上がったデータセットは以下。

todofuken.topojson

サンプルコード

example

1件のコメント