带有多个标记的google api v3 infowindow不起作用 [英] google api v3 infowindow with multiple markers doesn't work

问题描述

我试图在infowindow内容上写下我的循环的记录编号。

结果是，我读了每个infowindow的最后一个记录号（10），而不是1,2,3 ... 10

有人可以帮助我吗？在此先感谢

代码是这样的：

I'm trying to write on the infowindow content, the record number of my loop.
The result is that i read the last record number (10) for each infowindow, and not 1,2,3...10
Someone can help me? Thanks in advance
The code is this:

    function generaMappaMulti() {

        var CoordinataIniziale = new google.maps.LatLng(44.714957, 10.733647);   //set initial coordinate
        var opzioni = { center: CoordinataIniziale, zoom: 10, mapTypeId: google.maps.MapTypeId.ROADMAP };  //set options to the map


        map = new google.maps.Map(document.getElementById("canvas_mappa"), opzioni);

        [...]

        for (var i = 0; i < 10; i += 1) {     //for each row...

            var Coordinate = new google.maps.LatLng(ObjLat, ObjLon);  

            marker = new google.maps.Marker({ position: Coordinate, map: map});   //add a marker to the map

            var infowindow = new google.maps.InfoWindow({
                content: i.toString()   //here is where i'm trying to write record number on the infowindows
            });


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


        }

    }
    google.maps.event.addDomListener(window, 'load', initialize);

推荐答案

试试这种方法：只创建1个infowindow并使用 setContent（）方法在事件侦听器中关闭。

Try this way: create only 1 infowindow and use the setContent() method in the event listener with a closure.

var infowindow = new google.maps.InfoWindow();

for (var i = 0; i < 10; i += 1) { //for each row...

    var Coordinate = new google.maps.LatLng(ObjLat, ObjLon);

    var marker = new google.maps.Marker({
        position: Coordinate,
        map: map
    }); //add a marker to the map

    google.maps.event.addListener(marker, 'click', (function (marker, i) {
        return function () {
            infowindow.setContent('Your content goes here');
            infowindow.open(map, marker);
        }
    })(marker, i));
}

以下是一个工作示例。

JSFiddle演示

这篇关于带有多个标记的google api v3 infowindow不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！