90 votes

Avoir juste une InfoWindow ouvrir dans Google Maps API v3

- Je besoin pour ouvrir un seul InfoWindow sur mon Google Map. J'ai besoin de fermer toutes les autres InfoWindow avant d'ouvrir un nouveau.

Pouvez-vous quelqu'un me guide sur ce point?

160voto

Daniel Vassallo Points 142049

Vous avez besoin de créer un InfoWindow objet, de conserver une référence à elle, et de réutiliser si pour tous les marqueurs. Citant l'API Google Maps Docs:

Si vous souhaitez uniquement une fenêtre d'informations à afficher à la fois (comme c'est le comportement sur Google Maps), il vous suffit de créer une fenêtre d'informations, vous pouvez réaffecter à des emplacements différents ou des marqueurs sur la carte des événements (tels que l'utilisateur clique).

Par conséquent, vous pouvez simplement créer l' InfoWindow objet juste après l'initialisation de votre carte, puis de gérer l' click des gestionnaires d'événement de vos marqueurs comme suit. Disons que vous avez un marqueur appelé someMarker:

google.maps.event.addListener(someMarker, 'click', function() {
   infowindow.setContent('Hello World');
   infowindow.open(map, this);
});

Puis l' InfoWindow doit fermer automatiquement lorsque vous cliquez sur un marqueur sans avoir à appeler l' close() méthode.

31voto

skarE Points 4070

Créez votre infowindow hors de la portée, de sorte que vous pouvez partager.

Voici un exemple simple:

var markers = [AnArrayOfMarkers];
var infowindow = new google.maps.InfoWindow();

for (var i = 0, marker; marker = markers[i]; i++) {
  google.maps.event.addListener(marker, 'click', function(e) {
    infowindow.setContent('Marker position: ' + this.getPosition());
    infowindow.open(map, this);
  });
}

14voto

Feco Points 61

J'ai eu le même problème, mais la meilleure réponse ne résout pas complètement, ce que j'ai eu à faire dans ma déclaration a été à l'aide de la ce relatives à mon marqueur actuel. Peut-être que cela aide quelqu'un.

for(var i = 0; i < markers.length; i++){
    name = markers[i].getAttribute("name");
    address = markers[i].getAttribute("address");        
    point = new google.maps.LatLng(parseFloat(markers[i].getAttribute("lat")), parseFloat(markers[i].getAttribute("lng")));                                     
    contentString = '<div style="font-family: Lucida Grande, Arial, sans-serif;>'+'<div><b>'+ name +'</b></div>'+'<div>'+ address +'</div>';                    
    marker = new google.maps.Marker({                       
        map: map,
        position: point,
        title: name+" "+address,
        buborek: contentString 
    });                                     
    google.maps.event.addListener(marker, 'click', function(){
        infowindow.setContent(this.buborek); 
        infowindow.open(map,this); 
    });                                                         
    marker.setMap(map);                 
}

6voto

user2827958 Points 59

un peu en retard, mais j'ai réussi à avoir un seul infowindow ouvert par maken infowindow une variable globale.

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

puis à l'intérieur de la listner

infowindow.close();
infowindow = new google.maps.InfoWindow({   
    content: '<h1>'+arrondissement+'</h1>'+ gemeentesFiltered                           
});

infowindow.open(map, this);

4voto

MansApps Points 219

Déclarer un globar var selectedInfoWindow; et utilisez-le pour maintenir l'ouverture de la fenêtre d'informations:

      var infoWindow = new google.maps.InfoWindow({
        content: content
      });

      // Open the infowindow on marker click
      google.maps.event.addListener(marker, "click", function() {
      //Check if there some info window selected and if is opened then close it
        if (selectedInfoWindow != null && selectedInfoWindow.getMap() != null) {
            selectedInfoWindow.close();
            //If the clicked window is the selected window, deselect it and return
            if (selectedInfoWindow == infoWindow) {
                selectedInfoWindow = null;
                return;
            }
        }
        //If arrive here, that mean you should open the new info window 
        //because is different from the selected
        selectedInfoWindow = infoWindow;
        selectedInfoWindow.open(map, marker);
      });

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