Google Maps API V3 適用事例
更新：2010.10.31
|
Google Maps API が V3 になり、なによりAPI key がいらなくなったことが大きいが、全体的に使いやすくなりました。しかし表示が遅くなった部分や、使い辛くなった部分も見られますが、今後改善されるものと思っています。 V3の公開されて1年以上経過し、当サイトでは新規に制作するコンテンツはV3に切り替えることにしました。 JavaScriptでのコーディン方法やhtmlへの実装等は他のサイトに任せ、当サイトではGoogle Maps API V3 を使った事例の紹介にとどめます。 使い方について検索すると、当社サイトがトップにあることがあり、クリックすると自サイトであることが多く、不親切だなぁと気付き、忘備録としてV2からV3への実装方法も記載することにしました。 |
 |
| 保土ヶ谷農産物直売所マップ |
|
各直売所（オリジナルアイコン）、kml（保土ヶ谷区）、直売所リストを表示しています。 V2に比較してアイコンの表示は格段に楽になったが、イベントの処理が面倒になりました。 |
|
| 高低表示 |
|
旧東海道の神奈川一里塚から四つ谷（辻堂）一里塚までの6里（約24km）の高低表示を行っています。 pathのポイントが多くなると機能しない（APIの問題）。347ポイントまでは機能することを確認。限界が何ポイントかは不明ですが、420ポイントでは機能しないことを確認済み。私のPCのメモリの問題かもしれません。 |
|
| ストリートビュー |
|
旧東海道保土ヶ谷宿を地図とストリートビューで案内。 V2はFlashでしたが、V3はHTML内でネイティブにサポートれたのでiPhoneでも見られます。 Googleマップとストリートビューを連動させています。 |
|
| ルート検索 |
|
車と徒歩、経由地は１ヶ所を指定できます。日本では自転車での検索はまだサポートされていません。 処理時間がかかりますが、日本縦断もできます。ただし積極的に船を使うので面白くありません。 |
|
| 円表示 |
|
保土ヶ谷一里塚を中心に指定した半径の円を描くデモ。 V3から google.maps.Circle クラスの登場で簡単に描画できるようになりました。 |
|
| 座標（緯度、経度、高度）表示 |
|
住所ジオコードにも対応。 東京測地系も近似的に表示しています。 |
|
| ラベル表示 |
| V2でも標準ではサーポートされておらずTLabelを使用しています。V3でも同様ですがBarattalo Blogが配布しているライブラリを参照しました。 |
|