3 votes

Contenu dynamique dans google maps api v3 info Windows sur plusieurs marqueurs personnalisés

J'ai le js ci-dessous qui implémente une carte google avec un ensemble de marqueurs personnalisés en boucle. J'ai besoin que chaque marqueur ait une fenêtre d'information différente de sorte que lorsque vous cliquez sur le marqueur, vous obtenez le contenu qui est pertinent. Pour l'instant, il n'ouvre pas la fenêtre d'information et ne me donne pas d'erreur dans la console.

infowindow = new google.maps.InfoWindow();

    for(var i=0; i<google_map_item.length; i++)
    {
        latlon = new google.maps.LatLng(google_map_item[i].lat, google_map_item[i].lon)
        bounds.extend(latlon);
        var iconcolor = google_map_item[i].iconColor;
        marker = new google.maps.Marker({
            map: map,
            position: latlon,
            icon: "https://chart.googleapis.com/chart?chst=d_map_pin_letter_withshadow&chld=" + (i + 1) + "|"+iconcolor+"|000000",
            type: 'flat',
            icon_color: '#ff0000', 
            label_color: '#ffffff', 
            width: '20', 
            height: '20', 
            label_size: '11',
                            clickable: true
        });

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

        map.fitBounds(bounds);
    }

5voto

Anup Points 869
var marker3 = new google.maps.Marker({
          map: map,                                                        
          icon: 'miniMarker.png',
          info: destArr[i][9],
          position: new google.maps.LatLng(destArr[i][7], destArr[i][8])
});
var infowindow3 = new google.maps.InfoWindow();
google.maps.event.addListener(marker3, 'mouseover', function () {
        infowindow3.setContent(this.info);                              
        infowindow3.open(map, this);                        
});

Exemple de travail avec plus de 20 marqueurs et fenêtre d'information

0voto

Steve Smith Points 136

La référence dans le tableau des marqueurs était incorrecte, comme indiqué dans cette question similaire.

Google Maps - Plusieurs marqueurs - 1 problème de fenêtre d'information

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X