CartoDB Torqueを使ってみよう
オープンでよかった
FOSS4G Seoulでleafletの開発者 Vladimir Agafonkinさんがいらっしゃったので、ちょこっとleafletの質問をしてみました。詳細はナイショなんですが、その中で「CartoDBのtarqueを使うのがいい」とのアドバイスも頂きました。Vladimir AgafonkinさんMapboxの人なのですが。FOSS4GはMapboxの人からCartoDBを教えてもらえる、とっても優しくオープンな世界です。
折角教えてもらったし使ったことなかったので、CartoDBで地図作ってみました。
CartoDB Torque
位置情報を持ったデータをCartoDBに入れることで簡単に可視化できます。特に日時の情報を含むポイントデータであれば、torqueを使うことでアニメーション表示することができます。データさえ用意してしまえば簡単なので試してみましょう。
データの準備
日付を含むオープンデータが何かないかなと探していたところ、
大阪市の犯罪発生情報
があったのでこれを使います。
平成25年~平成27年の"ひったくり"データをダウンロードしてきましょう。
ダウンロードしてきたままだと、下記のようなフォーマットです。
市区町村,町名,丁番,罪名,既遂未遂別,手口,ひったくり区分,年,月,日,時間,被害者の性別,被害者の年齢 大阪市北区,曾根崎,2丁目付近,窃盗,既遂,ひったくり,自動二輪,2013年,2月,24日,2時頃,女性,30代 大阪市北区,中崎,3丁目付近,窃盗,既遂,ひったくり,自動二輪,2013年,3月,6日,1時頃,女性,30代 大阪市北区,中崎,2丁目付近,窃盗,既遂,ひったくり,自動二輪,2013年,4月,19日,20時頃,女性,30代
3年分のデータを1ファイルにして、必要な情報のみ抜き出しました。
住所は1カラムにまとめています。また、年月日についても1カラムにまとめました。
大阪市北区曾根崎2丁目,自動二輪,2013/2/24 大阪市北区中崎3丁目,自動二輪,2013/3/6 大阪市北区中崎2丁目,自動二輪,2013/4/19
この状態では地図上にマッピングできませんので、住所から経緯度への変換が必要になります。変換には、東京大学空間情報科学研究センターが提供するCSVアドレスマッチングサービスを使用しました。
アドレスマッチングの結果、経度、緯度、マッチングレベルが追記されたファイルが作成されます。詳細なマッチングが必要な場合は、マッチングレベルを確認して情報を使用するか/しないか、住所情報の見直しが必要になりますが、ここではこだわらないことにします。
大阪市北区曾根崎2丁目,自動二輪,2013/2/24,大阪府/大阪市/北区/曽根崎/二丁目,135.50031,34.70002,5,6 大阪市北区中崎3丁目,自動二輪,2013/3/6,大阪府/大阪市/北区/中崎/三丁目,135.50510,34.70839,5,6 大阪市北区中崎2丁目,自動二輪,2013/4/19,大阪府/大阪市/北区/中崎/二丁目,135.50586,34.70853,5,6
CartoDBへのDataset作成
ユーザ作成工程は省略します。
Datasetsの画面から、"NEW DATASET"を選択します。
読み込むデータはDrag&Dropでブラウザに持ってきて指定できます。データを指定をしたら"CONNECT DATASET"を選択します。
読み込みが終わるとDATASET VIEWになり、データ内容が表示されます。
データセット名、フィールド名はダブルクリックすることで編集することができます。必要に応じてわかりやすい名称に変更しておきましょう。
- field2がひったくりの区分
- field5が経度
- field6が緯度
- field3が日付
であることを確認しておきます。特にfiled3はカラムのタイプが"date"になっていることを確認しておきましょう。"date"もしくは"number"のカラムを使ってしか、アニメーション表示はできません。
"date"になっていない場合は、新しいカラムを"date"で作成、SQLを使用してデータをdateに変換したうえでコピー、といった手順が必要になります。
さてdatasetを作成した際に一番重要になるのが、geometryのカラムです。ここを使って地図上へプロットを行います。今回のデータだと、読み込みが終わった段階ですべてnullになっています。オレンジの"GEO"ボタンからgeometryを設定します。
Longitude, Latitudeのカラムを指定したうえで、"CONTINUE"を選択します。
これでgeometryも設定された状態になります。
"MAPVIEW"に移動しましょう。
読み込んだデータがプロットされているのが確認できます。
wizardsを使う
プロットはされていますが、すべてのデータが同じ色で表示されている状態です。表現については、cartcssを自分で書いて細かく指定していくことも可能ですが、まずはwizardsを使用してみましょう。
CATEGORY
例えばcategoryを使用すると、簡単に凡例わけすることができます。
field2のひったくり区分を使用して凡例わけした例です。
TORQUE
アニメーション表示してみましょう。torqueを選んで、Time Columnを指定してあげるだけで、日時のスライダーが追加されます。TORQUE CATの方を使うと、凡例わけした状態にもできます。
HEATMAP
heatmapをアニメーション表示することもできます。HEATMAPを選んでおいて、animatedをONします。Time Columnを指定してあげましょう。
publish
表現を付け終わったら右上の"PUBLISH"を選択して公開用のURLや、埋め込み用のhtmlを作成することができます。
ここまで
ちょっと触ってみただけですが簡単にデータの可視化ができますね。
またCartoDBのすごいところはデータを見て表現をおすすめしてくるところです。いろいろなデータを上げて試してみましょう。