【发布时间】:2011-04-23 07:15:02
【问题描述】:
使用最新版本的 Google 地图。如何使用经纬度添加标记并使用 JavaScript 自动调整地图的缩放级别以包含所有标记?
【问题讨论】:
标签: javascript google-maps google-maps-api-3 google-maps-markers
使用最新版本的 Google 地图。如何使用经纬度添加标记并使用 JavaScript 自动调整地图的缩放级别以包含所有标记?
【问题讨论】:
标签: javascript google-maps google-maps-api-3 google-maps-markers
Google Maps API v3 提供了一个 LatLngBounds 对象,您可以向其中添加多个 LatLng 对象。然后,您可以将其传递给Map.fitBounds() 函数,如下所述:
部分示例
var latlng = [
new google.maps.LatLng(1.23, 4.56),
new google.maps.LatLng(7.89, 1.01),
// ...
];
var latlngbounds = new google.maps.LatLngBounds();
for (var i = 0; i < latlng.length; i++) {
latlngbounds.extend(latlng[i]);
}
map.fitBounds(latlngbounds);
【讨论】:
getPosition() 方法获取标记的位置。
您可以通过为每个纬度/经度对实例化一个 marker 对象来为您的谷歌地图添加标记:
var marker = new google.maps.Marker({
position: currentLatLng,
map: map,
title:"Title!"
});
标记构造器上的map 选项会将新市场对象与您的地图相关联。
要缩放地图以包含新标记,请在 map 对象上使用 fitBounds 方法。 fitBounds 将latLngBounds 对象作为参数。这个对象有一个方便的 extend 方法,它将调整边界以包含新的纬度/经度。因此,您只需要遍历所有点,在单个 latLngBounds 对象上调用 extend。这将扩展范围以包括所有标记。完成此操作后,将此对象传递给 map 上的 fitBounds 方法,它将缩放以显示所有新标记。
【讨论】:
以下内容对我有用
map.fitBounds(bounds);
// add a zoom to the map
var listener = google.maps.event.addListener(map, 'idle', function()
{
if(map.getZoom() > 16)
map.setZoom(17);
google.maps.event.removeListener(listener);
});
在 setZoom() 方法中设置您想要的缩放。值越大,位置细节显示越宽,值越小,位置细节会节流和缩小
【讨论】: