在 Google Maps API V3中使用 fitBound()之后使用 setZoom()

我正在使用 fitBound ()来设置地图上的缩放级别，包括当前显示的所有标记。但是，当我只有一个标记可见时，缩放等级是100% (... 我认为缩放等级是20...)。但是，我不希望它是那么远放大，以便用户可以调整的位置的标记，而不必缩小。

我有以下密码:

var marker = this.map.createMarker(view.latlng, this.markerNumber);
this.map.bounds.extend(view.latlng);
this.map.map.setCenter(this.map.bounds.getCenter());
this.map.map.fitBounds(this.map.bounds);
if (this.markerNumber === 1) {
this.map.map.setZoom(16);
}
this.markerNumber++;

其中 this.map.bound 先前定义为:

this.map.bounds = new google.maps.LatLngBounds();

然而，我遇到的问题是，如果我使用 this.map.map.fitBounds(this.map.bounds);，this.map.map.setZoom(16);行就不能工作，但是，我知道这行代码是正确的，因为当我注释掉 fitBound ()行时，setZoom ()神奇地开始工作。

知道我该怎么解决吗？我在考虑设置一个最大极速级别作为一个替代方案，如果我不能让这个工作。

98936 次浏览
小开

我有简单而肮脏的解决办法。
使用 If else..。

var marker = this.map.createMarker(view.latlng, this.markerNumber);
this.map.bounds.extend(view.latlng);
this.map.map.setCenter(this.map.bounds.getCenter());
if (this.markerNumber === 1) {
this.map.map.setZoom(16);
} else {
this.map.map.fitBounds(this.map.bounds);
}
this.markerNumber++;
小开
最佳答案

好了，我想明白了。很明显，fitbound ()是异步发生的，因此在设置缩放工作之前必须等待 bounds_changed事件。

map = this.map.map;


map.fitBounds(this.map.bounds);
zoomChangeBoundsListener =
google.maps.event.addListenerOnce(map, 'bounds_changed', function(event) {
if (this.getZoom()){
this.setZoom(16);
}
});
setTimeout(function(){google.maps.event.removeListener(zoomChangeBoundsListener)}, 2000);

更新 : 使用 addListenerOnce查看@Nequin 的答案，找到一个更好的不需要超时的解决方案。

小开

我只是给函数 addBounds(position)添加了一行代码，它就修复了它，如下所示:

    addBounds: function(position) {
this.get('bounds', new google.maps.LatLngBounds()).extend(this._latLng(position));
this.get('map').fitBounds(this.get('bounds'));
this.get('map').setZoom(16);//line added
return this;
},
小开 
google.maps.event.addListenerOnce(yourMap, 'bounds_changed', function(event) {
if (this.getZoom() > 15) {
this.setZoom(15);
}
});

这个解决方案工作得更好... 而不是等待超时删除侦听器。在使用 fitBounds之前直接调用这个函数(我相信调用 after 也可以)。

小开

我发现额外的变焦有点不和谐。如果在调用 fitBound 之前设置 maxZoom 选项(然后在回调中取消设置) ，您可以避免使用这个选项:

map.setOptions({
maxZoom: 10
});


map.setCenter(new google.maps.LatLng(-89, -179)); // make sure it changes so the idle listener gets called back


map.fitBounds(bounds);


var listener = google.maps.event.addListenerOnce(map, "idle", function()
{
map.setOptions({
maxZoom: 999
});
});
小开

所有带有事件侦听器的解决方案对我来说都不起作用(this. getZoom ()在回调中总是没有定义，this. setZoom ()没有效果)。

我想出了一个很有效的解决方案:

function set_zoom() {
if(map.getZoom()) {map.setZoom(map.getZoom() - 1);}
else {setTimeout(set_zoom, 5);}
}
setTimeout(set_zoom, 5);

提交答案