Question

我正在尝试显示代理商列表，其中包含电话，电子邮件等信息......以及每个带地址的小型Google地图。地址是动态的，并通过树枝中的循环呈现。

问题是只有第一张地图是渲染。

function initMap() {

var x = document.querySelectorAll（＆＃39; div [id ^ =＆＃34; map - ＆＃34;]＆＃39;）;

for(var i  = 1; i < x.length; ++i )
{
    geocoder = new google.maps.Geocoder();
    var latlng = new google.maps.LatLng(53.3496, -6.3263);
    var mapOptions = 
    {
        zoom: 16,
        center: latlng
    }

    var stringAddress = '';
    var stringAddress = $("#address-"+i).text();

    map = new google.maps.Map(document.getElementById('map-'+ i), mapOptions);

    codeAddress(stringAddress);//call the function
}

}

和我的代码功能：

function codeAddress(address) {

geocoder.geocode( {address:address}, function(results, status) 
{
    if (status == google.maps.GeocoderStatus.OK) {

        map.setCenter(results[0].geometry.location);//center the map over the result
        //place a marker at the location
        var marker = new google.maps.Marker(
        {
            map: map,
            position: results[0].geometry.location
        });
    } else {
        alert('Geocode was not successful for the following reason: ' + status);
    }
});

}

Answer 1

我发现循环错误的解决方案。

而不是

for(var i  = 1; i < x.length; ++i )

做

for(var i  = 1; i <= x.length; ++i )

显示多个谷歌地图列表

1 个答案: