WordPressにGoogle Maps API V3！

＜目次＞始めに地図を読み込んだ時、複数のマーカーから任意の一つのインフォウィンドウ（infowindow）を最初から表示する。

• （その1）外部XMLファイルでなく内部ソースにマーカー用の配列を記述する。
• （その2）マーカーのインフォウィンドウ（吹き出し）を地図の中心座標に表示させるpanTo（）メソッドを使ったサンプル
• （その3）イベントリスナー’dragstart’で、地図をドラッグしたらマーカーのインフォウィンドウ（吹き出し）を閉じて削除する。
• （その4）マーカー（アイコン）の配列についての検証(２次元配列を理解してみる)
• （その5）XMLファイル（配列）の複数マーカーから特定markerのインフォウィンドウ（infowindow）を最初から一つだけ表示するサンプルデモ完成

前回作成した地図にインフォウィンドウ（吹き出し）を地図の中心に表示させるためのコードを追加しておきます。

map.panToを使います。とりあえずクリックイベントに追加。これで、マーカーをクリックすると地図の中心座標にインフォウィンドウが表示されることになります。あとで、地図が初期表示されたときのインフォウィンドウも同じコードで地図の中心座標に表示させます。

google.maps.event.addListener(marker, ‘click’, function()

{

infoWindow.setContent(html);

infoWindow.open(map,marker);

map.panTo( latlng);

});

次に、インフォウィンドウの削除用のコードを追加します。

（つづく）

◆ Google Maps API v3　Yインフォウィンドウ（吹き出し）を地図の中心座標に表示させるpanTo（）を使ったサンプルデモ

• インフォウィンドウ（吹き出し）を地図の中心座標に表示させるpanTo（）を使ったサンプル

◆Google Maps JavaScript API V3

• Google Maps API v3 目次に戻る

スポンサードリンク