Многократное окно Google Maps

Question

В настоящее время у меня есть карты Google, которые будут отображать некоторые маркеры на карте из моей БД ... Я хотел бы добавить информационное окно, когда пользователи нажимают на маркер.но проблема в том, что он отображается только на последнем загруженном маркере, почему?

Вот код для создания маркера и информационного окна.

<script type="text/javascript">
function initialize() {
    var myOptions = {
        zoom: 3,
        center: new google.maps.LatLng(41.850033, -87.6500523),
        disableDefaultUI: true,
        navigationControl: true,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

    setMarkers(map, offices);
}


/**
 * Data for the markers consisting of a name, a LatLng and a zIndex for
 * the order in which these markers should display on top of each
 * other.
 */
var offices = [<cfoutput>#officeList#</cfoutput>];

function setMarkers(map, locations) {
    // Add markers to the map
    // Marker sizes are expressed as a Size of X,Y
    // where the origin of the image (0,0) is located
    // in the top left of the image.
    // Origins, anchor positions and coordinates of the marker
    // increase in the X direction to the right and in
    // the Y direction down.
    var image = new google.maps.MarkerImage('images/pin.png',
    // This marker is 20 pixels wide by 32 pixels tall.
    new google.maps.Size(14, 26),
    // The origin for this image is 0,0.
    new google.maps.Point(0, 0),
    // The anchor for this image is the base of the flagpole at 0,32.
    new google.maps.Point(0, 32));

    for (var i = 0; i < locations.length; i++) {
        var office = locations[i];
        var myLatLng = new google.maps.LatLng(office[1], office[2]);

        var marker = new google.maps.Marker({
            position: myLatLng,
            map: map,
            icon: image,
            title: office[0],
            zIndex: office[3]
        });

        var contentString = "Hello!!!";
        var infowindow = new google.maps.InfoWindow({
            content: contentString
        });
        google.maps.event.addListener(marker, 'click', function() {
            infowindow.open(map, marker);
        });
    }
}
</script>

Answer 1

Я также наткнулся на эту проблему.

Вот как я это исправил:

Я использовал функцию для привязки маркера к информационному окну.

Answer 2

http://www.codefx.biz/2011/01/google-maps-api-v3-multiple-infowindows

этот способ тоже работает!