Avere un solo InfoWindow aperto in Google Maps API v3

StackOverflow https://stackoverflow.com/questions/1875596

Domanda

Ho bisogno di avere un solo InfoWindow aperta sul mio Google Map. Ho bisogno di chiudere tutti gli altri InfoWindows prima di aprire uno nuovo.

Qualcuno mi può mostrare come fare questo?

È stato utile?

Soluzione

È necessario creare solo un oggetto InfoWindow, mantenere un riferimento ad essa, e riutilizzare se per tutti i marcatori. Citando dalla API di Google Maps Documenti :

  

Se si desidera solo una finestra di informazioni per visualizzare in un momento (come è il comportamento su Google Maps), è necessario creare un solo finestra di informazioni, che è possibile riassegnare in posizioni diverse o marcatori su mappa eventi (come utente fa clic ).

Di conseguenza, si può semplicemente voler creare l'oggetto InfoWindow subito dopo si inizializza la mappa, e quindi gestire i gestori di eventi click dei vostri marcatori come segue. Diciamo che avete un marcatore chiamato someMarker: 

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

Poi il InfoWindow dovrebbe chiudersi automaticamente quando si fa clic su un nuovo marcatore, senza dover chiamare il metodo close().

Altri suggerimenti

Crea il tuo infowindow fuori del campo di applicazione in modo da poter condividere.

Ecco un semplice esempio: 

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

Ho avuto lo stesso problema, ma la risposta migliore non ha risolto del tutto, quello che dovevo fare nella mia dichiarazione per stava usando il presente relative al mio marcatore corrente. Forse questo aiuta qualcuno. 

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

un po 'in ritardo, ma sono riuscito ad avere un solo infowindow aperta maken infowindow una variabile globale. 

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

poi dentro The Listener 

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

infowindow.open(map, this);

Dichiarare un var selectedInfoWindow; globale e utilizzarlo per tenere l'infowindow aperto: 

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

Ecco una soluzione che non ha bisogno di creare un solo infowindow di riutilizzarlo. È possibile continuare a creare molte infoWindows, l'unica cosa che serve è quello di costruire una funzione closeAllInfoWindows, e chiamarla prima di aprire un nuovo infowindow. Quindi, mantenendo il codice, è sufficiente:

  1. Crea una matrice globale per memorizzare tutti i infoWindows 

    var infoWindows = [];

  2. Conservare ogni nuova infowindow nella matrice, subito dopo l'infowindow = new ... 

    infoWindows.push(infoWindow);

  3. Crea la funzione closeAllInfoWindows 

    function closeAllInfoWindows() {
    for (var i=0;i<infoWindows.length;i++) {
        infoWindows[i].close();
    }
}

  4. Nel codice, chiamata a closeAllInfoWindows () poco prima di aprire l'infowindow.

Saluti,

risolto in questo modo: 

function window(content){
    google.maps.event.addListener(marker,'click', (function(){
        infowindow.close();
        infowindow = new google.maps.InfoWindow({
            content: content
        });
        infowindow.open(map, this);
    }))
}
window(contentHtml);

Google Maps ti permette di avere una sola finestra di informazioni aperta. Quindi, se si apre una nuova finestra, poi l'altro si chiude automaticamente.

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top