Question

我在地图上绘制了一系列标记（使用地图api的v3）。

在v2中，我有以下代码：

  bounds = new GLatLngBounds();

  ... loop thru and put markers on map ...
  bounds.extend(point);
  ... end looping

  map.setCenter(bounds.getCenter());
  var level = map.getBoundsZoomLevel(bounds);
  if ( level == 1 ) 
    level = 5;
  map.setZoom(level > 6 ? 6 : level);

这样可以确保地图上始终显示适当的详细程度。

我正在尝试在v3中复制此功能，但setZoom和fitBounds似乎没有合作：

... loop thru and put markers on the map
  var ll = new google.maps.LatLng(p.lat,p.lng);
  bounds.extend(ll);
... end loop

var zoom = map.getZoom();
map.setZoom(zoom > 6 ? 6 : zoom);
map.fitBounds(bounds);

我尝试了不同的排列（例如，在setZoom之前移动fitBounds）但是我对setZoom的处理似乎不会影响地图。我错过了什么吗？有没有办法做到这一点？

Answer 1

在this discussion on Google Groups我发现基本上当你做fitBounds时，缩放是异步发生的，所以你需要捕获缩放和边界变化事件。最后一篇文章中的代码通过一个小修改为我工作...因为它可以阻止你完全缩放大于15，所以使用第四篇文章中的想法将标记设置为仅在第一次执行时。< / p>

// Do other stuff to set up map
var map = new google.maps.Map(mapElement, myOptions);
// This is needed to set the zoom after fitbounds, 
google.maps.event.addListener(map, 'zoom_changed', function() {
    zoomChangeBoundsListener = 
        google.maps.event.addListener(map, 'bounds_changed', function(event) {
            if (this.getZoom() > 15 && this.initialZoom == true) {
                // Change max/min zoom here
                this.setZoom(15);
                this.initialZoom = false;
            }
        google.maps.event.removeListener(zoomChangeBoundsListener);
    });
});
map.initialZoom = true;
map.fitBounds(bounds);

希望有所帮助，

安东尼。

Answer 2

如果没有尝试，我会说你应该能够在获得缩放级别之前只使用fitBounds()来做到这一点，即

map.fitBounds(bounds);
var zoom = map.getZoom();
map.setZoom(zoom > 6 ? 6 : zoom);

如果您确实尝试过并且无效，则可以在minZoom ^{(api-reference)}中使用MapOptions设置地图，如下所示：

var map = new google.maps.Map(document.getElementById("map"), { minZoom: 6 });

这可以防止地图在使用fitBounds()时进一步缩小。

Answer 3

安东尼的解决方案非常好。我只需要修复初始页面加载的缩放（确保你没有太大的缩放开始）这对我来说就是这个诀窍：

var zoomChangeBoundsListener =
    google.maps.event.addListener(map, 'bounds_changed', function(event) {
        google.maps.event.removeListener(zoomChangeBoundsListener);
        map.setZoom( Math.min( 15, map.getZoom() ) );
    });


map.fitBounds( zoomBounds );

Answer 4

您也可以在调用fitBounds（）之前设置maxZoom选项，然后重置该值：

if(!bounds.isEmpty()) {
    var originalMaxZoom = map.maxZoom;
    map.setOptions({maxZoom: 18});
    map.fitBounds(bounds);
    map.setOptions({maxZoom: originalMaxZoom});
}

Answer 5

当您在一个项目上调用map.fitBounds（）时，地图可能会过于放大。要解决此问题，只需将'maxZoom'添加到mapOptions ...

即可

var mapOptions = {
  maxZoom: 15
};

Answer 6

在我的情况下，我只想将缩放级别设置为比google maps在fitBounds中为我选择的缩放级别少一个。目的是使用fitBounds，但也确保在任何地图工具等下都没有标记。

我的地图是早期创建的，然后页面的其他动态组件都有机会添加标记，每次添加后都会调用fitBounds。

这是在最初创建地图对象的初始块中...

var mapZoom = null;

然后将这个添加到添加了标记的每个块中，就在调用map.fitBounds之前...

google.maps.event.addListenerOnce(map, 'bounds_changed', function() { 
    if (mapZoom != map.getZoom()) { 
        mapZoom = (map.getZoom() - 1); 
        map.setZoom(mapZoom); 
    } 
});

在没有检查的情况下使用'bounds_changed'时，无论是否需要，地图都会为每个标记缩小一次。相反，当我使用'zoom_changed'时，我有时会在地图工具下有标记，因为缩放实际上并没有改变。现在它始终被触发，但是检查确保它仅在需要时缩小一次。

希望这有帮助。

Answer 7

由于Google Maps V3是事件驱动的，因此当 zoom_changed 事件触发时，您可以告诉API将缩放设置为适当的数量：

var initial = true
google.maps.event.addListener(map, "zoom_changed", function() {
    if (initial == true){
       if (map.getZoom() > 11) {
         map.setZoom(11);
         initial = false;
       }
    }
});

我使用初始来使地图在最终的fitBounds被置换时不会过度缩放，而是让用户尽可能多地缩放。在没有条件的情况下，用户可以进行超过11的任何缩放事件。

Answer 8

我发现以下内容相当不错。它是Ryan的answer到https://stackoverflow.com/questions/3334729/...的变体。这样可以保证显示的面积至少是offset的两倍（以度为单位）。

const center = bounds.getCenter()
const offset = 0.01
const northEast = new google.maps.LatLng(
    center.lat() + offset,
    center.lng() + offset
)
const southWest = new google.maps.LatLng(
    center.lat() - offset,
    center.lng() - offset
)
const minBounds = new google.maps.LatLngBounds(southWest, northEast)
map.fitBounds(bounds.union(minBounds))

Answer 9

我只是有同样的任务要解决，并使用一个简单的函数来解决它。

它不在乎边界中有多少个标记 - 如果有很多并且缩放已经很远，这会缩小一点，但是当只有一个标记（或很多非常接近于彼此），那么缩小很重要（可使用 extendBy 变量自定义）：

var extendBounds = function() {
  // Extends the Bounds so that the Zoom Level on fitBounds() is a bit farer away
  var extendBy = 0.005;
  var point1 = new google.maps.LatLng(
    bounds.getNorthEast().lat() + extendBy,
    bounds.getNorthEast().lng() + extendBy
  )
  var point2 = new google.maps.LatLng(
    bounds.getSouthWest().lat() - extendBy,
    bounds.getSouthWest().lng() - extendBy
  )
  bounds.extend(point1);
  bounds.extend(point2);
}

为了使用它，我使用了一个自己的函数来做fitBounds()：
地图是我的 GoogleMap 对象

var refreshBounds = function() {
  extendBounds();
  map.fitBounds(bounds);
}

谷歌地图v3：执行分钟。使用fitBounds时缩放级别

9 个答案: