WebGL Globeを使って地震分布を作成してみた

Googleから、WebGLを使った視覚化プラットフォーム「WebGL Globe」が公開されました。WebGLを使うのはむずかしかったのですが、これを使って地震分布(東北地方太平洋沖地震)を作ってみました(お前どんだけ地震分布すきやねん...って言われそうですが)。

WebGLを使うため、Firefox 4以降、Chrome 9以降(Chromeは自動的にupdateされるからあまりバージョンは意味ないのですが)でしか見ることができません。また、ThinkPad X201sでは見ることができなかっため、ビデオ周りのドライバも関係すると思います(WebGLはOpenGL ES 2.0ベースなので、動きそうですが...だめでした)。

"start"ボタンを押せば動きます。時系列(日単位)で震源地でマグニチュードを元にした棒がにょきっと伸びます。

---

START

 

   

---

(出典 気象庁)

データは2011/3/9～2011/4/21までで震度4以上&マグニチュード5.0以上だけにしています。理由はデーターベースからデータを取り出すのが大変なためです(使いづらい)。

ただし、今回はデータをGoogleスプレッドシートに配置し、JSONPで取得してWebGL Globeが理解できるデータ構造にチェンジしています。このため、データを増やすことは容易になります。データはearth quake testにあります(たぶん、再整理するので、ここのシートは今回限り)。

ズームイン・アウトはキーボードの上・下カーソルで行ってください。Firefoxはマウスのスクロールはここでは効きませんでした。Chromeは動きます。

ブログに貼れるようにglobe.jsも一部修正しています(最初の表示場所、サイズの固定化、リサイズ不可、world.jpegの取得箇所)し、外部サイトが今持っていないので、このブログに強引に貼り付けました。

色が青色しか使用できないところが辛いですが(これはアニメーションさせるには0でデータを入れないといけないらしく、他の色が...glob-searchを見ると色を変更できるようなので、次回にはちょっと...)

とりあえず作ってみましたが、WebGL Globeをブログに貼るのはしんどかったです。次は、前回の様な形で比較及等を行いたいと思っています。

ソースはソース置き場にglobe_Tohoku_Pacific_Ocean_Earthquake_r1.htmlがありますので、それをダウンロードしてください。このHTMLだけでも動くようになっています。