GoogleMap：多个标记显示相同的InfoWindow且无法在移动设备上单击

Question

Google Map API上的“多个标记InfoWindows”问题 有两个问题：

• 标记显示 SAME InfoWindow
• 同样，标记在移动设备上无法点击。

这是我的代码：

var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 10,
    center: new google.maps.LatLng(60.037760, -44.100494),
    mapTypeId: google.maps.MapTypeId.ROADMAP
});

var locations = [
                    ['Alvin', 60.074433, -44.011917],
                    ['Sirius', 60.037760, -44.100494]
                ];

for (var i = 0; i < locations.length; i++) {
    var marker = new google.maps.Marker({
        position: new google.maps.LatLng(locations[i][1], locations[i][2]),
        map: map
    });

    var infowindow = new google.maps.InfoWindow({content: locations[i][0]});

    new google.maps.event.addListener( marker, 'click', function() {
        infowindow.open(map,this);
    });
}

Answer 1

创建对infowindow的全局引用。

var infowindow = new google.maps.InfoWindow();
for (var i = 0; i < locations.length; i++) {
    var marker = new google.maps.Marker({
        position: new google.maps.LatLng(locations[i][1], locations[i][2]),
        map: map
    });

    new google.maps.event.addListener( marker, 'click', function() {
         infowindow.setContent(locations[i][0]);
         infowindow.open(map,this);
    });
}