タグ: Google Maps API

こないだ仕事で、Google Maps JavaScript API V3を利用してとあるサービスのサービス拠点を検索・表示するページを作成しました。
要はマップを動かすとその中心点から近いサービス拠点を検索してマップ上にマーカーを表示するというよくあるアレです。

さて。

Google Maps API V3でストリートビューを表示できるようにするためには、streetViewControlというパラメータがtrueである必要があります。

今まではデフォルトではfalseだったため、明示的にtrueにしなければストリートビューが表示されることはありませんでした。

ところが。
先月10月ごろから、デフォルトがtrueに変更されました。

冒頭のサービス拠点検索ページもその影響でストリートビューが表示されるようになってしまい、納品前で余計な不具合を出したくなかったのですぐにfalseに変更しました。
が、どうやら先方の社内でストリートビューが見られることの評判が良かったらしく、戻して欲しいと言われたので戻しました。

そんなにいいものなのかと思って、実際にストリートビューで表示させてみたんですが、これがなかなか面白くて、マップ上に配置したマーカーがセカイカメラのエアタグのように表示されるんです。
近くにあるマーカーは大きく、遠くにあるマーカーは小さく。ちゃんと遠近感があります。さすがに高さは無理みたいですが。
たしかにこれは表示できたほうが拠点の案内サービスとしては親切でしょうし、納得です。

んで。
適当にデモを作ってみました。
30個ほどランダムでマーカーを配置してあるので、左上のペグマン(黄色いの)を道にドラッグ＆ドロップしてストリートビューを表示させてみてください。

コードは以下のとおりです。

Tweet