Question

我想创建三个具有不同值的标记。在for循环中，我有以下内容：

var marker = new google.maps.Marker({map: map, position: point, clickable: true});

marker.info = new google.maps.InfoWindow({
  content: '<b>Speed:</b> ' + values.inst + ' knots'
});

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

我遇到的问题是当我点击3个标记中的任何一个时，只会弹出最后一个标记的infowindow。我该如何解决这个问题？

Answer 1

也许你会发现下面的例子很有用：

var cityList = [
            ['Chicago', 41.850033, -87.6500523, 1],
            ['Illinois', 40.797177,-89.406738, 2]
        ]

function addMarkers()
{
    var marker, 
    i,
    infowindow = new google.maps.InfoWindow();

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

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

Answer 2

您需要将此代码移出for循环，并转移到您从for循环调用的单独函数中。如果你发布更多的代码，包括循环和数组，循环迭代，我可以给出更具体的建议。

但作为一个例子：

var places = [
    { lat:1, lng:1, name:'one one' }
    { lat:-1, lng:-1, name:'minus one one' }
];

for( var i = 0, n = places.length;  i < n;  i++ ) {
    addPlace( places[i] );
}

function addPlace( place ) {
    // here you have place.lat, place.lng, and place.name to work with
}

如何在google maps v3中为每个标记创建infowindow？

2 个答案: