我正在使用fitBounds()在我的地图上设置缩放级别,也包括当前显示的所有标记。但是,当我只有一个标记可见时,缩放级别为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.bounds先前定义为:
this.map.bounds = new google.maps.LatLngBounds();
然而,我遇到的问题是,如果我使用this.map.map.setZoom(16);
,行this.map.map.fitBounds(this.map.bounds);
不起作用,但是,我知道这行代码是正确的,因为当我注释掉fitBound时( ),setZoom()神奇地开始运作。
我是如何解决这个问题的?我正在考虑将maxZoom级别设置为替代,如果我无法使其工作。
答案 0 :(得分:109)
好吧,我已经弄明白了。显然,fitbounds()是异步发生的,因此在设置缩放之前你必须等待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的答案,以获得不需要超时的更好解决方案。
答案 1 :(得分:93)
google.maps.event.addListenerOnce(yourMap, 'bounds_changed', function(event) {
if (this.getZoom() > 15) {
this.setZoom(15);
}
});
此解决方案效果更好...而不是等待超时删除侦听器。在使用fitBounds
之前直接调用它(我相信调用后也会起作用)。
答案 2 :(得分:15)
我发现额外的缩放有点刺耳。如果在调用fitBounds之前设置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
});
});
答案 3 :(得分:2)
我有简单而肮脏的解决方案 使用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++;
答案 4 :(得分:1)
我刚刚在函数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;
},
答案 5 :(得分:0)
我认为正确的做法是你需要在map.fitBounds(bounds)
之后设置缩放级别。只需在map.setZoom(16)
之后添加map.fitBounds(bounds)
即可。它对我来说很好。
答案 6 :(得分:0)
所有带有事件监听器的解决方案对我来说都不起作用(this.getZoom()总是在回调中未定义,而this.setZoom()没有效果。)
我提出了这个解决方案很好用的方法:
function set_zoom() {
if(map.getZoom()) {map.setZoom(map.getZoom() - 1);}
else {setTimeout(set_zoom, 5);}
}
setTimeout(set_zoom, 5);