Google 地圖事件

2019-09-21 17:19 更新

Google 地圖事件


點擊標記縮放地圖 - 綁定在google地圖上的事件。



點擊標記縮放地圖

我們?nèi)匀皇褂蒙弦槐槲恼率褂玫挠鴤惗氐牡貓D。

點用戶點擊標記時實現(xiàn)縮放地圖的功能(點擊標記時綁定地圖縮放事件)。

代碼如下:

實例

// Zoom to 9 when clicking on marker
google.maps.event.addListener(marker,'click',function() {
  map.setZoom(9);
  map.setCenter(marker.getPosition());
  });

嘗試一下 ?

使用 addListener() 事件處理程序來注冊事件的監(jiān)聽。該方法使用一個對象,一個事件來監(jiān)聽,當指定的事件發(fā)生時 函數(shù)將被調(diào)用。


重置標記

我們通過給地圖添加事件處理程序來改變 'center' 屬性,以下代碼使用 center_changed 事件在3秒后標記移會中心點:

實例

google.maps.event.addListener(map,'center_changed',function() {
  window.setTimeout(function() {
    map.panTo(marker.getPosition());
  },3000);
});

嘗試一下 ?


點擊標記時打開信息窗口。

點擊標記在信息窗口顯示一些文本信息:

實例

var infowindow = new google.maps.InfoWindow({
  content:"Hello World!"
  });

google.maps.event.addListener(marker, 'click', function() {
  infowindow.open(map,marker);
  });

嘗試一下 ?


設(shè)置標記及打開每個標記的信息窗口

當用戶點擊地圖時執(zhí)行一個窗口

用戶點擊地圖某個位置時使用 placeMarker() 函數(shù)在指定位置上放置一個標記,并彈出信息窗口:

實例

google.maps.event.addListener(map, 'click', function(event) {
  placeMarker(event.latLng);
  });

function placeMarker(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);
}

嘗試一下 ?


Google 地圖 - 事件參考手冊

Google Maps API 參考手冊。

以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號