谷歌地圖事件

單擊標記進行縮放

我們仍然使用上一頁的地圖：以英國倫敦為中心的地圖。

現在，我們希望在用戶單擊標記時進行縮放（我們將一個事件處理程序附加到標記上，以便在單擊時縮放地圖）。

這是添加的代碼：

實例

// 單擊標記時縮放至 9
google.maps.event.addListener(marker,'click',function() {
  map.setZoom(9);
  map.setCenter(marker.getPosition());
});

我們使用 addListener() 事件處理程序來注冊事件通知。該方法接受的參數是：

• 一個對象
• 一個要偵聽的事件
• 一個在指定事件發生時調用的函數

平移回到標記

在這里，我們保存縮放更改并在 3 秒后平移地圖：

實例

google.maps.event.addListener(marker,'click',function() {
  var pos = map.getZoom();
  map.setZoom(9);
  map.setCenter(marker.getPosition());
  window.setTimeout(function() {map.setZoom(pos);},3000);
});

單擊標記時打開信息窗口

單擊標記可顯示包含文本的信息窗口：

實例

var infowindow = new google.maps.InfoWindow({
  content:"Hello World!"
});
google.maps.event.addListener(marker, 'click', function() {
  infowindow.open(map,marker);
});

設置標記并為每個標記打開信息窗口

當用戶單擊地圖時運行函數。

placeMarker() 函數會在用戶單擊的位置放置一個標記，并顯示一個包含該標記的緯度和經度的信息窗口：

實例

google.maps.event.addListener(map, 'click', function(event) {
  placeMarker(map, event.latLng);
});
function placeMarker(map, location) {
  var marker = new google.maps.Marker({
    position: location,
    map: map
  });
  var infowindow = new google.maps.InfoWindow({
    content: 'Latitude: ' + location.lat() +
    '<br>Longitude: ' + location.lng()
  });
  infowindow.open(map,marker);
}