google api v3 infowindow with multiple markers doesn't work

Question

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);

score -1 · Accepted Answer · answered Mar 03 '15 at 11:54

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));
}

Below is a working example.

JSFiddle demo

google api v3 infowindow with multiple markers doesn't work

1 Answers1