Tenga solo una ventana de información abierta en Google Maps API v3

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

Pregunta

Necesito tener sólo una ventana de información abierta en mi mapa de Google.Necesito cerrar todas las demás ventanas de información antes de abrir una nueva.

¿Alguien puede mostrarme cómo hacer esto?

¿Fue útil?

Solución

Necesitas crear solo uno InfoWindow objeto, mantenga una referencia a él y reutilícelo para todos los marcadores. Citando los documentos API de Google Maps:

Si solo desea que se muestre una ventana de información a la vez (como es el comportamiento en Google Maps), solo necesita crear una ventana de información, que puede reasignar a diferentes ubicaciones o marcadores en eventos del mapa (como los clics del usuario).

Por lo tanto, es posible que simplemente desee crear el InfoWindow objeto justo después de inicializar su mapa, y luego manejar el click controladores de eventos de sus marcadores de la siguiente manera.Digamos que tienes un marcador llamado someMarker:

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

Entonces el InfoWindow debería cerrarse automáticamente al hacer clic en un nuevo marcador sin tener que llamar al close() método.

Otros consejos

Crea tu ventana de información fuera del alcance de manera que se puede compartir.

Este es un ejemplo sencillo: 

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

Yo tenía el mismo problema, pero la mejor respuesta no resolvió por completo, lo que tenía que hacer en mi para la declaración estaba usando el presente relacionada con mi marcador actual. Tal vez esto ayude a alguien. 

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 poco tarde, pero me las arreglé para tener sólo una ventana de información abierta por maken infowindow una variable global. 

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

a continuación, dentro de la listner 

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

infowindow.open(map, this);

Declarar una var selectedInfoWindow; global y utilizarlo para mantener la ventana de información abierto: 

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

Es necesario hacer un seguimiento de su InfoWindow objetos y llamar a la cerrar método en él cuando manipule el evento click en un nuevo marcador .

N.B No es necesario llamar estrecha en el objeto ventana de información compartida, llamando abierto con un marcador diferente cerrará automáticamente el original. Ver respuesta de Daniel detalles.

Esta es una solución que no necesita para crear un único infoWindow reutilizarlo. Puede seguir creando muchas ventanas de información, lo único que se necesita es construir una función closeAllInfoWindows, y lo llaman antes de abrir una nueva ventana de información. Por lo tanto, el mantenimiento de su código, sólo tiene que:

  1. Crea una matriz global para almacenar todas las ventanas de información 

    var infoWindows = [];

  2. Almacenar cada nueva infoWindow en la matriz, justo después de la infoWindow = new ... 

    infoWindows.push(infoWindow);

  3. Cree la función closeAllInfoWindows 

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

  4. En su código, llame a closeAllInfoWindows () justo antes de abrir la infoWindow.

Saludos,

solucionado de esta manera: 

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 le permite tener sólo una ventana de información abierta. Por lo que si se abre una nueva ventana, entonces el otro se cierra automáticamente.

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top