スポンサーリンク

D3.jsでよくあるツリーレイアウトの可視化をしてみた

D3.js JavaScript データビジュアライゼーション

「よくある」ってなんだよって感じではありますが…。

ひとまず例のサイトがありますので、こちらになります。

- http://bl.ocks.org/mbostock/1093025

これを見ていて、よく端末内のディレクトリ構成と容量を同時に表示しているような感じにしてみようと思い、例のソースコードを参考にしながら作ってみました。

データが適切なものがなかったので、都道府県のデータになりますが、階層構造を持つデータを下に開いていくツリーレイアウトです。

量の部分には、政府統計の平成22年の国勢調査から人口データを拝借しました。

※画像をクリックするとページを移動します。


こんな感じ!

人口を長さに置き換えて、パーセンテージで表示しました。

こうしてみると、たとえ東京の人口でも、日本全体の人口の約10%程度なんですねー。

個人的には思ったより少ない印象を受けました。

コメント