javascript - Google Maps v3 API 扩展边界。 Javascript 操作方法?

标签 javascript google-maps

function initialize(){
// Creating a map
var map = new google.maps.Map(document.getElementById('map'), {
  zoom: 10,
  center: new google.maps.LatLng(53.0123601276819, -2.44519164333635),
  mapTypeId: google.maps.MapTypeId.ROADMAP
});

var m = [];

function addMarker(title, lat, lng) {
    m[m.length] = new google.maps.Marker({
        position: new google.maps.LatLng(lat, lng),
        map: map,
        title: title,  
        clickable: true,
        icon: 'http://domain.com/MVC/images/full.png' 
    });

} 

addMarker('Home', 53.0682143712504, -2.52150736731894);
addMarker('Away', 53.0123601276819, -2.44519164333635);
addMarker('Away', 59.0123601276819, -2.44519164333635);    

// Create a LatLngBounds object
var bounds = new google.maps.LatLngBounds(); 

for (var i = 0; i < m.length; i++) {
  // Insert code to add marker to map here

  // Extend the LatLngBound object
  bounds.extend(m[i]);

}
alert(m[0]);
map.fitBounds(bounds);
  document.write(getBounds());   

}

以上是我的代码。

我的意图是开发一个显示大量标记并平移缩放以使所有标记都适合我的屏幕的 map 。

我是 JS 新手。

我的理解是

var m = [];

创建一个空数组。

然后每次我调用 addMarker() 时,细节都会添加到这个数组 m

我在顶部设置了默认缩放和中心点。

然后我添加各种标记。

然后我循环遍历 m 数组中的每个键并使用其中的数据扩展边界。

据我所知,map.fitBounds(bounds); 应该重新定义适用于所有标记的缩放/中心。

事实并非如此。 我的所有标记都显示了,但是缩放/中心不是这样自动调整的,我不知道为什么。

如有任何建议,我们将不胜感激。 谢谢

最佳答案

您需要将 LatLng 对象传递给 bounds.extend 函数。

代码如下:

....
bounds.extend(new google.maps.LatLng(lat, lng));
....

关于javascript - Google Maps v3 API 扩展边界。 Javascript 操作方法?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3610135/

相关文章:

javascript - 如何获取 HTML 表单中的 JS 函数结果?

android - MapView v2 保持上下文

使用 Google Maps Java API 时出现 java.net.UnknownServiceException

javascript - Google 行车路线至最近的道路

名称中带有 "-"的 Javascript 样式变量无法更改?

javascript - 自定义时工具提示未按预期显示

javascript - Jquery 代码未在测试站点上运行

javascript - 更改由 DirectionsRenderer 生成的 Google Maps API v3 中各条腿的折线颜色

google-maps - 防止谷歌地图窃取键盘输入

javascript - 在 jquery 中停止警报禁用选项