ただ地図を表示するだけでも面白いのに、それが立体になるとさらにワクワクします。これはGoogleアースなどで立体的な地図を見た時、誰もが感じた感情でしょう。立体化されることで、より体験がリアルに感じられます。 今回紹介するmap33.jsはWeb上で地図を立体的に表示してくれます。建物などではなく、等高線に基づいた立体化になります。

map33.jsの使い方

例です。位置情報は自分で指定します。3Dでぐりぐり動かせます。

位置情報を富士山に指定すればこの通り。

map33.jsは指定した位置情報に基づいて、その周囲の標高を取得して3Dマップに展開します。最初は位置情報を中心とした4×4のタイルですが、ダブルクリックするとその部分のタイルも追加されます。徐々に空間が埋められていく様子は面白いです。

map33.jsはJavaScript製のオープンソース・ソフトウェア（MIT License）です。

デモ blaze33/map33.js: A JavaScript library to make 3D maps with three.js.