GUNMA GIS GEEK

群馬県の片隅でオープンデータとデータビジュアライゼーションとGIS(地理情報システム)に戯れるエンジニアのブログ。

*

【D3.js】全国の熱中症発生数を表示してみた(CSVデータ読み込み)

     - d3.js ver.3

はてなブックマーク - 【D3.js】全国の熱中症発生数を表示してみた(CSVデータ読み込み)
Pocket

Heatstroke

とりあえず、色々やってみて覚えよう!ってことで。
国立環境研究所」よりいただいた熱中症発生数のデータを可視化。
ダウンロードしたtsvファイルをExcelを使ってcsvに変更、文字コードをUTF8にコンバートしてD3に読み込ませています。

d3.csvでcsvファイルを読み込むと1行目をキーとした連想配列が返ってきます。あとはそれをデータセットとして使用するだけ。簡単!

example

ホントは、ソートを行った時に、サークルが移動するようなインタラクションにしたかったのだけれど、力及ばすでした orz

↑やり方が分かったので追記。

example

はてなブックマーク - 【D3.js】全国の熱中症発生数を表示してみた(CSVデータ読み込み)
Pocket

 - d3.js ver.3

Comment

  関連記事

分解
【D3.js】画像をデータセットとして使う

読み込んだ画像ファイルをcanvasに転写し、getImageDataで取得した …

可視化失敗例
データビジュアライゼーション失敗

目的を頭に置き続けましょう。それが試金石となり、導きの光となります。円形のレイア …

sponsor:転職ならen派遣ならen インタラクティブ・データビジュアライゼーション――D3.jsによるデータの可視化
「インタラクティブ・データビジュアライゼーション」D3.jsのイチオシ参考書が出版されます

オライリーより、2月19日にD3.jsの入門書「インタラクティブ・データビジュア …

ダウンロード
【D3.js】複数のデータファイルの読み込み(非同期処理)をまとめる

d3で複数のデータファイル(jsonやcsv)を読み込む場合、以下のようにコール …

Pie Chart Btn
D3.jsで円グラフになるボタン作った。

円グラフ祭り!

Hackers_and_Painters
D3の魅力

d3.js Advent Calendar 2013 6日目の参加記事です。 技 …

neighborscolor
【D3.js】隣接区の数で地図に色塗りをしてみました。

example 隣接する区画を表示するの続きです。 隣接するエリア数を元にコロプ …

ツイートワードクラウド
【D3.js】「全ツイート履歴」からWord cloudを作ってみた。

嗜好がバレる。 自分のすべてのツイートをダウンロードできるようにしました 日本の …

no image
【D3.js】 値の正規化(d3.scale)

例えば、上記の …

Past 7 Days - Earthquakes
【D3.js】stereographicプロジェクションを使って全天球表示

example アメリカ地質調査所(USGS)が公開している過去7日間の地震デー …