Google Maps - Marqueurs multiples - 1 Problème InfoWindow

Question

Je n'arrive pas à voir mes marqueurs pour afficher différents infowindows. Les marqueurs affichent toujours le contenu du dernier "contentString".

J'ai lu quelques autres messages mais aucun d'entre eux semble aider.

Voici le code:

function setMarkers(branches, map) { 
     var bounds = new google.maps.LatLngBounds(); 
     var contentString = null; 
     var infowindow = null; 
     infowindow = new google.maps.InfoWindow(); 
     for (var i = 0; i < branches.length; i++) { 
      var marker = null; 
      branch = branches[i]; 
      var myLatlngMarker = new google.maps.LatLng(branch[0], branch[1]); 
      contentString = '<p>' + branch[3] + '</p>'; 

      var marker = new google.maps.Marker({ 
       position: myLatlngMarker, 
       map: map, 
       title: branch[2] 
      }); 

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

      bounds.extend(myLatlngMarker); 
     } 

     map.fitBounds(bounds); 
    } 

Quelqu'un peut-il voir ce que je fais mal?

Merci

Answer 1

droit,

J'ai trouvé une solution. J'ai ajouté une propriété supplémentaire au marqueur appelé 'info', puis je l'ai référencé à partir de l'événement 'addlistener' infowindow.setContent (this.info) '.

Voici le code mis à jour:

function setMarkers(branches, map) { 
    var marker = null; 
    var infowindow = new google.maps.InfoWindow(); 
    var bounds = new google.maps.LatLngBounds(); 

    for (var i = 0; i < branches.length; i++) { 
     branch = branches[i]; 

     var myLatlngMarker = new google.maps.LatLng(branch[0], branch[1]); 

     var marker = new google.maps.Marker({ 
      position: myLatlngMarker, 
      map: map, 
      title: branch[2], 
      info: branch[3], 
      icon: '<%=Icon%>' 
     }); 

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

     bounds.extend(myLatlngMarker); 
    } 

    map.fitBounds(bounds); 
} 

Answer 2

Avez-vous essayé de déclarer la infowindow et contentString l'intérieur de la boucle for, au lieu de l'extérieur de la boucle?

function setMarkers(branches, map) { 
     var bounds = new google.maps.LatLngBounds(); 

     for (var i = 0; i < branches.length; i++) { 
      var infowindow = new google.maps.InfoWindow(); 
      var contentString = ""; 
      var marker = null; 
      branch = branches[i]; 
      var myLatlngMarker = new google.maps.LatLng(branch[0], branch[1]); 
      contentString = '<p>' + branch[3] + '</p>'; 

      var marker = new google.maps.Marker({ 
       position: myLatlngMarker, 
       map: map, 
       title: branch[2] 
      }); 

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

      bounds.extend(myLatlngMarker); 
     } 

     map.fitBounds(bounds); 
    } 

Answer 3

Im ayant le même problème. J'ai pu obtenir le titre apparaître différent en utilisant si ce code:

setMarkers(map, airports); 
} 

function setMarkers(map, locations) 
    { 
    //you only need 1 infoWindow 
    var infowindow = new google.maps.InfoWindow({ 
     content: "holding" //content will be set later 
    }); 

    for (var i = 0; i < locations.length; i++) 
    { 
     var airport = locations[i]; 
     var myLatLng = new google.maps.LatLng(airport[1], airport[2]); 
     var marker = new google.maps.Marker({ 
      position: myLatLng, 
      map: map, 
      title: airport[0], 
      zIndex: airport[3], 
      html: airport[4], 
     }); 




     google.maps.event.addListener(marker, 'click', function() { 
       infowindow.setContent(this.html);//set the content 
       infowindow.open(map,this); 
     }); 
    } 
    } 

Answer 4

La raison pour laquelle il affiche toujours la dernière contentString est parce que c'est ce qu'il est réglé quand l'événement se déclenche de clic. Il est écrasé à chaque itération de la boucle for.

Vous devez affecter le gestionnaire d'événements à l'aide d'une fermeture et transmettre contextString en tant qu'argument à la fonction, en retournant le gestionnaire réel.

google.maps.event.addListener(marker, 'click', function(content) { 
    return function(){ 
     infowindow.setContent(content);//set the content 
     infowindow.open(map,this); 
    } 
}(contentString));