Google API v3适合地图缩放并绑定到所有标记

时间:2012-02-09 18:30:20

标签: javascript jquery google-maps google-maps-markers

我已经研究了一段时间了,我正在尝试实现latlngbounds以动态地适应地图画布中的所有引脚。但它不起作用。如果有人做了类似于我的代码的话,那么有人能引导我走上正确的道路吗?

var geocoder; 
var map; 
function initializeMap() { 
    geocoder = new google.maps.Geocoder(); 
    var latlng = new google.maps.LatLng(39.88445,-86.11084); 
    var myOptions = { 
      zoom: 9, 
      center: latlng, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    map = new google.maps.Map(document.getElementById("map_canvas"), 
        myOptions); 
} 
function codeAddress() { 
    var bound = new google.maps.LatLngBounds(); 
    var markers = new Array(); 
    var infowindow = new google.maps.InfoWindow({});  
    $('.LocAddHidden').each(function(index) { 
        var addy = $(this).text(); 
        geocoder.geocode( { 'address': addy}, function(results, status) { 
            if (status == google.maps.GeocoderStatus.OK)  
            { 
                map.setCenter(results[0].geometry.location); 
                var marker = new google.maps.Marker({ 
                position: results[0].geometry.location, 
                map: map,                
                title:addy       
                });      
            }  
        }); 
    }); 
} 

  $(document).ready(function(){ 
    initializeMap(); 
    codeAddress();    
  for(var i in markers) 
  { 
    bound.extend(markers[i].getPosition()); 
  } 
  map.fitBounds(bound); 
});                           

4 个答案:

答案 0 :(得分:3)

让IE8工作..

而不是使用:for(var i in markersArray)

使用此:for (i = 0; i < markersArray.length; i++)

答案 1 :(得分:2)

主要问题是你在空循环中扩展边界。我没有看到你在codeAddress()开头创建的markers数组中添加任何内容。您应该在地理编码请求中添加您创建的标记。

但是不是在一个循环中将它添加到一个markers数组,而是在另一个循环中扩展边界,你可以摆脱第二个循环,只是扩展第一个循环中的边界。

并且您不需要在每次循环迭代时重新定位地图。在最后设置边界需要重新定位和缩放。

并且Cheery指出了关于变量范围的另一个问题。

答案 2 :(得分:0)

您需要在代码中声明markers数组,并将每个创建的标记推送到该数组

// global
var markers = [];

// after created
markers.push(marker);

答案 3 :(得分:0)

经过多次尝试,我有一些简单实用的东西:

function simulateBounds() {

    var bounds = new google.maps.LatLngBounds;

    for (var i = 0; i < arrayChinchetas.length; i++) {
        bounds.extend(arrayChinchetas[i].getPosition());
    }

    SurOeste = bounds.getSouthWest();
    NorEste = bounds.getNorthEast();

    //Constructs a rectangle from the points at its south-west and north-east corners.
    var latlandBounds = new google.maps.LatLngBounds(SurOeste, NorEste);

    map.fitBounds(latlandBounds);

}