如何知道用戶是否更改縮放（Google Maps V3）

Question

我正在使用 Google Maps 和 Angularjs 開發一個應用程序。 我有這個代碼來控制縮放是否改變

google.maps.event.addListener(map, 'zoom_changed', function(){

  });

問題是，我只需要在用戶更改縮放比例時才執行此事件。 我的代碼中有一個fitBounds()也可以更改縮放fitBounds() 。

var latlngbounds = new google.maps.LatLngBounds();
  for (var i = 0; i < latlng.length; i++) {
    latlngbounds.extend(latlng[i]);
  }

  map.fitBounds(latlngbounds);

是否有區分用戶操作的選項？

Answer 1

在一般情況下，當前接受的解決方案可能無法正確解決此問題。 轉到 Google Maps API 文檔中地圖 UI 事件的交互式演示。 請注意，如果您將光標定位在地圖上並使用鼠標的滾輪滾動，則不會觸發任何mouse或drag事件，因為鼠標保持靜止。

當前的解決方案假設在mouseover事件之后不會發生程序化地圖更新，這對於原始發布者的應用程序可能是正確的，但在更一般的應用程序中可能並非如此。

我提出了下面的替代解決方案。

首先，無論您在代碼中以編程方式更新地圖的任何地方，都在地圖上設置一個自定義屬性——我們將調用我們的systemZoomChange表明更改是以編程方式啟動的。

var latlngbounds = new google.maps.LatLngBounds();
for (var i = 0; i < latlng.length; i++) {
  latlngbounds.extend(latlng[i]);
}

map.systemZoomChange = true
map.fitBounds(latlngbounds);

然后在任何事件偵聽器上，添加對自定義systemZoomChange屬性的檢查，並在標記時重置它，以避免對系統事件進行操作。

map.addListener('zoom_changed', function () {
  if (map.systemZoomChange) {
    map.systemZoomChange = false  // Reset the flag for a system-initiated event
  } else {
    // Handle the user-initiated event
  }
});

Answer 2

好的，我找到了方法

google.maps.event.addListenerOnce(map, 'mousemove', function(){

    google.maps.event.addListener(map, 'zoom_changed', function(){

    });

  });

首先，它檢測鼠標是否移動，然后檢測縮放是否改變並正常工作！