Google MAPS APIプログラミング

Google Maps API version 2(旧バージョン)に関する情報です。 現在、最新版はGoogle Maps JavaScript API version 3となっており、version 2の利用は推奨されていません。

これから新しくGoogle Maps JavaScript APIを使う場合には、version 3の解説をご覧下さい。

Google MAPS APIを使うための準備

Google MAPS API keyを取得する

Google MAPS APIでのデバッグ

GLog.writeによるログ出力

Google Maps Javascript自動生成ツール

Google maps簡単作成ツール：GMapCreator

Google MAPS API

Google MAPS APIの単純な例

初期化位置を指定する

衛星地図表示にする

地図＋衛星写真のハイブリッド表示にする

立体地図表示にする

簡易コントロールボタンを表示する

コントロールボタンを表示する

地図/衛星写真 切り替えボタンを表示する

地図/衛星写真 切り替えボタンの表示位置を指定する

GOverviewMapControlを追加する

ローカル検索機能を表示する

キーボードで地図を操作できるようにする

地図をドラッグで移動できないようにする

クリック処理

Zoomイベントを取得する

moveイベントを取得する

movestartイベントを取得する

moveendイベントを取得する

maptypechangedイベントを取得する

ふきだしを表示する

ふきだし内のメッセージにHTMLを利用する

ふきだし内のメッセージに画像を入れる

ふきだし内のメッセージにYouTubeを入れる

拡大地図のふきだしを出す

ふきだし＋クリック処理

ふきだしを閉じる

GMarkerクリック⇒ふきだし表示

マーカーを貼り付ける

マーカーを貼り付ける(画像マーカー)

マーカーにふきだしを付ける

マーカーにクリックイベント処理を割り当てる

マーカー上にマウスが来たらふきだしを表示

ドラッグ可能なマーカの作成

ドラッグ後にマーカが跳ねないようにする

GMarkerOptions

画面上に画像を固定表示する

アニメーションしながら移動する

アニメーションしながら連続的に移動する

GPolylineで線を引く

GPolylineで線を引く(2)

2点間の距離を求める

GPolygonで図形を描く

GPolygonクリック処理

面積を計測する

Formと組み合わせる

radioボタンと組み合わせる

checkboxと組み合わせる

selectと組み合わせる

selectフォームと地図タイプを連動させる

住所情報 (GClientGeocoder)

住所を使って緯度経度を取得する(1)

住所を使って緯度経度を取得する(2)

スタイルシートと組み合わせる

Google Mapsの上にアニメーションGIFを配置する

Google Mapsアニメーション＋アニメーションGIF

Google Mapsを半透明にする

Yahoo!地図との切り替え表示

Google maps APIでAJAX

GXmlHttpを使ってテキストファイルを取得する

GXmlHttpを使ってXMLファイルを取得する

GXmlHttpにCGIからXMLを渡す

GXmlHttpにPHPからXMLを渡す

GXmlHttpを使ってCGIに情報を渡す

GXmlHttpを使ってPHPに情報を渡す

アフィリエイトと組み合わせる

Google maps apiとAmazonアフィリエイトのMashup例

Google Maps API version 2

Google Maps API version 2 変更点概要

旧 version 1 API解説

その他

Google MapsでGoogle Earthを表示する

地震を表現する

緯度/経度の取得

日本語エスケープ

山手線ぐるぐるぐる