如何使用谷歌地图中的地址数组显示infowindow和折线?

时间:2013-09-10 08:00:30

标签: javascript google-maps google-maps-api-3

我可以在谷歌地图上显示多个标记,但我的信息窗口没有出现,也无法显示折线...任何人都可以帮我解决这个问题,这里是我的代码示例,适用于标记但不适用于折线和infowindow ......

我从表行和列中获取地址......

var t= document.getElementById('map_table');

var latlng = new google.maps.LatLng(12.97160, 77.59456); 

var map = new google.maps.Map(document.getElementById('map_selected'), 
{
    zoom:12,
    center:latlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
});

var address = [];
var mark=[];
var info = [];
var pathMap =[];

for(var i=0; i<t.rows.length; i++)
{
    address[i] = t.rows[i+1].cells[2].innerHTML + "," + t.rows[i+1].cells[3].innerHTML;
    var gc = new google.maps.Geocoder();
    gc.geocode({'address': address[i]}, function (res, status)
    {
        mark[i]=new google.maps.Marker({
        position: res[0].geometry.location,
        map: map
    });

    info[i] = new google.maps.InfoWindow({
        content:address[i]
    });

    google.maps.event.addListener(mark[i], 'click', function() {
        info[i].open(map,mark[i]);
    });

    pathMap.push(res[0].geometry.location);

    if (pathMap.length == t.rows.length)
    {
        var routePath = new google.maps.Polyline({
        path: pathMap, 
        strokeColor: "#FF0000",
        strokeOpacity: 0.50,
        strokeWeight: 2
    });

    pathMap.setMap(map);
  }});
}

1 个答案:

答案 0 :(得分:0)

google.maps.event.addListener(mark[i], 'click', function() {
    info[i].open(map,mark[i]);
});

ifor循环中可用。循环打印标记。当有人实际点击mark[i]时,事件发生在循环之外,因此i没有任何价值且info[i]没有用。

您可以这样做:指定标记的title

mark[i]=new google.maps.Marker({
    position: res[0].geometry.location,
    map: map,
    title: i
});

click事件中抓住标题并显示相应的信息。

google.maps.event.addListener(mark[i], 'click', function( e ) {
    info[ e.title ].open(map, e);
});

我还没有测试最后一点代码,你需要试验事件目标。