D3.js

WEB+DB PRESS Vol.76 のD3.jsの記事をちょっと試したかっただけだったの です。 D3.js自体は記事のとおりに書けば理解出来ましたが、「過去1000件の Foursquareチェックイン履歴」を取ってくるのに難儀しました。記事では さらっと書いてあるだけですねw どうにかしてoauth_tokenを取得する 私は http://tdoc.info/foursquare-API/authentication.html を参考にし て、泥臭く手に入れました。Twitterだと簡単なのにね。 https://developer.foursquare.com/ にアクセスし、適当なマイアプリを作る。 以下にアクセスし、“code"を取得する(長いので改行入れてます)。 https://foursquare.com/oauth2/authenticate?client_id=<Client ID> &response_type=code&redirect_uri=<Redirect URI> ブラウザのアドレスバーに"code"が表示されるので、以下にアクセスす る(長いので改行入れてます)。 https://foursquare.com/oauth2/access_token?client_id=<Client ID> &client_secret=<Client secret>&grant_type=authorization_code &redirect_uri=<Redirect URI>&code=<2で取得したコード> oauth_tokenを取得出来た！ {"access_token":"XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX"} 過去1000件のFoursquareチェックイン履歴を取得する foursquare2 gemをインストールする。 % gem install foursquare2 取得できるか確認。 JSONフォーマットにしつつ、緯度と経度を取得する。 https://developer.foursquare.com/docs/users/checkins によると、 250ずつしか取得できないようなので、小分けにして取得。 こんなデータが取得できるはず。 [ {"coordinates": [139.645709, 35.667857]}, {"coordinates": [139.645709, 35.667857]}, {"coordinates": [139.641393, 35.666568]}, ... ] エラー吐いて972件しか取得できなかったけど、まあ良しとする。 JSONなので最後の”},“を”}“に置換するのを忘れずに。。 D3.js使って可視化 ここまでくれば記事のとおりにコードを書くだけです。こんな感じ で可視 化出来ます。ドラッグやズームイン・アウトにも対応しています☆ これ試したのは少し前なので忘れてましたが、日本地図を作るのもやや面 倒でした。Homebrewでgdalをインストールするのにかなり時間がかかると いう。。 D3.jsの本 PDF版は無料で入手することが出来ます。 [を] 【書評・感想】Getting Started with D3 eBook こちらはKindle版です。