- GoogleMap
- 2015-07-30 - 更新:2018-02-21
この記事は最終更新日から1年以上経過しています。
GoogleMap API v3でのイベントの追加と削除について
GMapインスタンスを生成
var myOptions = { center: new google.maps.LatLng(35, 135), zoom: 12 }; var map = new google.maps.Map(document.getElementById("map"), myOptions);
例1)「zoom_changed」イベントを追加します。
google.maps.event.addListener(map, "zoom_changed", function(){ });
例2)「click」イベントを追加します。
google.maps.event.addListener(map, "click", function(e){ });
指定したイベントリスナーを削除する
google.maps.event.clearListeners(map, "zoom_changed");
全てのイベントリスナーを削除する
google.maps.event.clearInstanceListeners(map);
リスナーをオブジェクトとして作成し、そのインスタンスを指定してリスナーを削除する
var zoomChanged_listener = google.maps.event.addListener(map, "zoom_changed", function(){ }); google.maps.event.removeListener(zoomChanged_listener);
イベントの種類については下記をご参照ください。
[GoogleMap v3のmapオブジェクトのイベント]
2016年10月31日追記
GoogleMapの読み込み完了時に一度だけ実行するイベントを追加
google.maps.event.addListenerOnce(map, "idle", function(){ });
リサイズの場合はトリガーを使用します。
// divリサイズ時mapイベント google.maps.event.addListener(map, "resize", function(LatLng) { map.setCenter(LatLng, 10); }); // divリサイズ時mapイベントのトリガー document.getElementById("map").onresize = function() { var LatLng = map.getCenter(); google.maps.event.trigger(map, "resize", LatLng); }
6,694 views