Javascript 谷歌地图 API V3 方法 fitBounds()
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10268033/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Google maps API V3 method fitBounds()
提问by maxdangelo
I have this code that renders a map.
我有这个渲染地图的代码。
function initialize() {
var myOptions = {
center: new google.maps.LatLng(45.4555729, 9.169236),
zoom: 13,
mapTypeId: google.maps.MapTypeId.ROADMAP,
panControl: true,
mapTypeControl: false,
panControlOptions: {
position: google.maps.ControlPosition.RIGHT_CENTER
},
zoomControl: true,
zoomControlOptions: {
style: google.maps.ZoomControlStyle.LARGE,
position: google.maps.ControlPosition.RIGHT_CENTER
},
scaleControl: false,
streetViewControl: false,
streetViewControlOptions: {
position: google.maps.ControlPosition.RIGHT_CENTER
}
};
var map = new google.maps.Map(document.getElementById("mapCanvas"),
myOptions);
var Item_1 = new google.maps.LatLng(45.5983128 ,8.9172776);
var myPlace = new google.maps.LatLng(45.4555729, 9.169236);
var marker = new google.maps.Marker({
position: Item_1,
map: map});
var marker = new google.maps.Marker({
position: myPlace,
map: map});
var bounds = new google.maps.LatLngBounds(myPlace, Item_1);
map.fitBounds(bounds);
}
Even if the two points are separated from 25 km I get this result:
即使这两个点相距 25 公里，我也会得到这个结果：
While I would like to render a higher level zoom.
虽然我想渲染更高级别的缩放。
Like this
像这样
I use the method fitBounds()
我使用方法fitBounds()
var bounds = new google.maps.LatLngBounds(myPlace, Item_1);
map.fitBounds(bounds);
Thanks for your support
谢谢您的支持
回答by Gabriele Petrioli
This happens because LatLngBounds()does not take two arbitrary points as parameters, but SW and NE points
发生这种情况是因为LatLngBounds()没有取任意两个点作为参数，而是取 SW 和 NE 点
use the .extend()method on an empty bounds object
.extend()在空的边界对象上使用该方法
var bounds = new google.maps.LatLngBounds();
bounds.extend(myPlace);
bounds.extend(Item_1);
map.fitBounds(bounds);
Demo at http://jsfiddle.net/gaby/22qte/
回答by Andrew Leach
LatLngBoundsmust be defined with points in (south-west, north-east) order. Your points are not in that order.
LatLngBounds必须按（西南，东北）顺序定义点。你的积分不是这个顺序。
The general fix, especially if you don't know the points will definitely be in that order, is to extend an empty bounds:
一般的修复，特别是如果你不知道点肯定会按这个顺序，是扩展一个空的边界：
var bounds = new google.maps.LatLngBounds();
bounds.extend(myPlace);
bounds.extend(Item_1);
map.fitBounds(bounds);
The API will sort out the bounds.
API 将整理边界。
回答by vanthome
I have the same problem that you describe although I'm building up my LatLngBounds as proposed by above. The problem is that things are async and calling map.fitBounds()at the wrong time may leave you with a result like in the Q.
The best way I found is to place the call in an idle handler like this:
尽管我正在按照上面的建议构建 LatLngBounds，但我遇到了与您描述的相同的问题。问题是事情是异步的，map.fitBounds()在错误的时间调用可能会给你带来类似 Q 的结果。我发现最好的方法是将调用放在一个空闲的处理程序中，如下所示：
google.maps.event.addListenerOnce(map, 'idle', function() {
map.fitBounds(markerBounds);
});
回答by Mourad MAMASSI
var map = new google.maps.Map(document.getElementById("map"),{
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var bounds = new google.maps.LatLngBounds();
for (i = 0; i < locations.length; i++){
marker = new google.maps.Marker({
position: new google.maps.LatLng(locations[i][1], locations[i][2]),
map: map
});
bounds.extend(marker.position);
}
map.fitBounds(bounds);
