設置固定區域，但在放大時出現問題（Google Maps API）

Question

我有以下JSFiddle（最初來自此線程： Google Maps v3- 限制可見區域和縮放級別 ），向用戶提供固定的Google Maps區域： http : //jsfiddle.net/9f3f82vw/4/

 // This is the minimum zoom level that we'll allow
 var minZoomLevel = 14;

 var map = new google.maps.Map(document.getElementById('map'), {
     zoom: minZoomLevel,
     center: new google.maps.LatLng(53.2170249, 6.5656727),
     mapTypeId: google.maps.MapTypeId.ROADMAP
 });

var marker = new google.maps.Marker({
    position: {lat: 53.218573, lng: 6.567293},
    map: map,
    title: '???'
});

 // Bounds for Groningen
 var strictBounds = new google.maps.LatLngBounds(
 new google.maps.LatLng(53.2124505, 6.5558022), //Southwest
 new google.maps.LatLng(53.2212904, 6.5760153)); //Northeast

 // Listen for the dragend event
 google.maps.event.addListener(map, 'bounds_changed', function () {
     if (strictBounds.contains(map.getCenter())) return;

     // We're out of bounds - Move the map back within the bounds

     var c = map.getCenter(),
         x = c.lng(),
         y = c.lat(),
         maxX = strictBounds.getNorthEast().lng(),
         maxY = strictBounds.getNorthEast().lat(),
         minX = strictBounds.getSouthWest().lng(),
         minY = strictBounds.getSouthWest().lat();

     if (x < minX) x = minX;
     if (x > maxX) x = maxX;
     if (y < minY) y = minY;
     if (y > maxY) y = maxY;

     map.setCenter(new google.maps.LatLng(y, x));
 });

 // Limit the zoom level
 google.maps.event.addListener(map, 'zoom_changed', function () {
     if (map.getZoom() < minZoomLevel) map.setZoom(minZoomLevel);
 });

該解決方案的問題在於，一旦放大，就無法靠近邊界附近的區域。 因此，如果您使用原始縮放比例（14）轉到地圖的南部，然后放大，您將注意到無法完全向南移動。

換句話說，您無法放大邊框。

編輯：我放下了整個邊框，並實現了一個霧層，以使用戶知道有一個他無法訪問的區域。 我是在http://maps.vasile.ch/geomask/的幫助下完成的

謝謝！

Answer 1

如果您希望用戶能夠移動地圖並將其保持在代碼的原始邊界strictBounds內， strictBounds只需處理事件即可使用戶strictBounds邊界， strictBounds ，拖動和縮放。 然后，調用map.panToBounds(strictBounds) 。 這將確保地圖進行最小平移，以將視口保持在邊界之內（反之亦然，取決於縮放級別）。

如果您不想使用strictBounds ，而是使用原始縮放級別中的邊界，則只需獲取並存儲該邊界到變量中，然后將其與map.panToBounds使用。 要獲取它們，請使用map.getBounds() 。 確定邊界和縮放級別后，這些邊界將可用。