読者です 読者をやめる 読者になる 読者になる

データ分析エンジニアが気まぐれに更新するブログ

勉強してきた技術などを適当に書いていければと思います。

各地域の時系列気象データをCanvasとD3.jsで可視化してみた

データ可視化 D3.js JavaScript

各地域の気象データをHTML5CanvasとD3.jsを使って可視化しました。


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


データは気象庁からダウンロードして、加工させていただきました。


気象庁ホームページ:http://www.jma.go.jp/jma/index.html


操作説明

・適当な場所をダブルクリックをして軸を作成する
(軸は、最高気温・最低気温・平均気温・風速・日照時間の5通り)
(置ける軸の最大数は3つで3つ置くと三次元散布図っぽい感じに)

・ドラッグで移動、スクロールで拡大縮小

・右ドラッグでデータの範囲指定ができ、囲んだデータをグループ化して集計グラフを表示できる

・ゲージフィルターで可視化するデータの範囲を調整可能

・時系列のスライダーで任意の年のデータを可視化可能
(データは時系列で2009年~2013年のデータを格納)
(アニメーション再生をすると、2009年から2013年まで順番に可視化します)