Question

我想在缩放变化后获取地图的边界，但是之前zoom_changed事件会触发重新计算边界。因此，在zoom_changed处理程序中，您将获得先前的边界，而不是新的边界。

有没有办法如何在缩放变化上获得适当的界限？

Answer 1

如果您有兴趣，请发送bug这个问题。

有一个丑陋的解决方法：

google.maps.event.addListener(map, 'zoom_changed', function () {
    google.maps.event.addListenerOnce(map, 'bounds_changed', function (e) {
            my_zoom_handler(); // do your job here
    });
});

Answer 2

来自API documentation：

如果您尝试检测视口中的更改，请确保使用特定的bounds_changed事件而不是成分的zoom_changed和center_changed事件。由于Maps API独立触发后面这些事件，因此get_bounds（）可能不会报告有用的结果，直到视口具有权威性更改。如果你希望在这样的事件之后得到get_bounds（），请务必听取bounds_changed事件。

Answer 3

要绑定bounds_changed并在缩放后使用标记/贴图内容，请使用：

google.maps.event.addListener(map, 'zoom_changed', function() {
    this.zoomChanged = true;
});

google.maps.event.addListener(map,"bounds_changed",function() {
    if (this.zoomChanged) {
        this.zoomChanged = false;
        // DO YOUR STUFF
    }
});

Answer 4

我有同样的问题。这就是我最终努力解决其他解决方案所遇到的几个问题。

*无论您使用鼠标还是箭头键，都要正确执行边界

*按住箭头键不会停止边缘，因为平移加速导致它在一个步骤中“过冲”边缘，所以它会停止短路（尝试按住箭头键）方向，直到你到达边缘，然后释放并再次按下它，并使用一些解决方案，它将滚动一点点）

*当它碰到边缘时不会“反弹”

*正确执行变焦更改的界限

编辑：好的，所以当您使用滚轮更改缩放时它会起作用，但不能使用缩放控件。让我玩一下吧，我会看看能不能让它工作......

编辑2：事实证明，问题是因为我删除了平移控件。只要存在摇摄控制，就可以使用滚轮和变焦控制来正常工作。

编辑3：不......那不是它。我已经更新了代码来处理缩放控制。

// bounds of the desired area
var allowedBounds = new google.maps.LatLngBounds(
                    new google.maps.LatLng(-64, -64), 
                    new google.maps.LatLng(64, 64)
                    );

var zoomChanged = false;

google.maps.event.addListener(map, 'center_changed', function() {
  var mapBounds = map.getBounds();

  if(mapBounds.getNorthEast().lat() > allowedBounds.getNorthEast().lat()) {
    var newCenter = new google.maps.LatLng(map.getCenter().lat() -
                                           (mapBounds.getNorthEast().lat() -
                                           allowedBounds.getNorthEast().lat()),
                                           map.getCenter().lng(), true);
    map.panTo(newCenter);
    return;
  }

  if(mapBounds.getNorthEast().lng() > allowedBounds.getNorthEast().lng()) {
    var newCenter = new google.maps.LatLng(map.getCenter().lat(),
                                           map.getCenter().lng() -
                                           (mapBounds.getNorthEast().lng() -
                                           allowedBounds.getNorthEast().lng()), true);
    map.panTo(newCenter);
    return;
  }

  if(mapBounds.getSouthWest().lat() < allowedBounds.getSouthWest().lat()) {
    var newCenter = new google.maps.LatLng(map.getCenter().lat() +
                                           (allowedBounds.getSouthWest().lat() -
                                           mapBounds.getSouthWest().lat()),
                                           map.getCenter().lng(), true);
    map.panTo(newCenter);
    return;
  }

  if(mapBounds.getSouthWest().lng() < allowedBounds.getSouthWest().lng()) {
    var newCenter = new google.maps.LatLng(map.getCenter().lat(),
                                           map.getCenter().lng() +
                                           (allowedBounds.getSouthWest().lng() -
                                           mapBounds.getSouthWest().lng()), true);
    map.panTo(newCenter);
    return;
  }
}, this);

google.maps.event.addListener(map, 'zoom_changed', function() {
  zoomChanged = true;
}, this);

google.maps.event.addListener(map, 'bounds_changed', function() {
  if(zoomChanged) {   
    var mapBounds = map.getBounds();

    if(mapBounds.getNorthEast().lat() > allowedBounds.getNorthEast().lat()) {
      var newCenter = new google.maps.LatLng(map.getCenter().lat() -
                                             (mapBounds.getNorthEast().lat() -
                                             allowedBounds.getNorthEast().lat()),
                                             map.getCenter().lng(), true);
      map.panTo(newCenter);
      return;
    }

    if(mapBounds.getNorthEast().lng() > allowedBounds.getNorthEast().lng()) {
      var newCenter = new google.maps.LatLng(map.getCenter().lat(),
                                             map.getCenter().lng() -
                                             (mapBounds.getNorthEast().lng() -
                                             allowedBounds.getNorthEast().lng()), true);
      map.panTo(newCenter);
      return;
    }

    if(mapBounds.getSouthWest().lat() < allowedBounds.getSouthWest().lat()) {
      var newCenter = new google.maps.LatLng(map.getCenter().lat() +
                                             (allowedBounds.getSouthWest().lat() -
                                             mapBounds.getSouthWest().lat()),
                                             map.getCenter().lng(), true);
      map.panTo(newCenter);
      return;
    }

    if(mapBounds.getSouthWest().lng() < allowedBounds.getSouthWest().lng()) {
      var newCenter = new google.maps.LatLng(map.getCenter().lat(),
                                             map.getCenter().lng() +
                                             (allowedBounds.getSouthWest().lng() -
                                             mapBounds.getSouthWest().lng()), true);
      map.panTo(newCenter);
      return;
    }

    zoomChanged = false;
  }
}, this);

缩放更改后获取谷歌地图v3的界限

4 个答案: