Necesito tener solo una ventana de información abierta en mi mapa de Google. Necesito cerrar todas las demás InfoWindows antes de abrir una nueva.
¿Alguien puede mostrarme cómo hacer esto?
Necesito tener solo una ventana de información abierta en mi mapa de Google. Necesito cerrar todas las demás InfoWindows antes de abrir una nueva.
¿Alguien puede mostrarme cómo hacer esto?
Respuestas:
Necesita crear un solo
InfoWindow
objeto, mantener una referencia a él y reutilizarlo para todos los marcadores. Citando los documentos de la API de Google Maps :Por lo tanto, puede simplemente querer crear el
InfoWindow
objeto justo después de inicializar su mapa y luego manejar losclick
controladores de eventos de sus marcadores de la siguiente manera. Digamos que tiene un marcador llamadosomeMarker
:google.maps.event.addListener(someMarker, 'click', function() { infowindow.setContent('Hello World'); infowindow.open(map, this); });
Luego,
InfoWindow
debería cerrarse automáticamente al hacer clic en un nuevo marcador sin tener que llamar alclose()
método.fuente
Cree su ventana de información fuera del alcance para poder compartirla.
He aquí 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); }); }
fuente
Tuve el mismo problema, pero la mejor respuesta no lo resolvió por completo, lo que tenía que hacer en mi declaración for era usar esto relacionado con mi marcador actual. Quizás 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); }
fuente
un poco tarde, pero me las arreglé para tener solo una ventana de información abierta al hacer de la ventana de información una variable global.
var infowindow = new google.maps.InfoWindow({});
luego dentro del listner
infowindow.close(); infowindow = new google.maps.InfoWindow({ content: '<h1>'+arrondissement+'</h1>'+ gemeentesFiltered }); infowindow.open(map, this);
fuente
Declare una barra global
var selectedInfoWindow;
y úsela para mantener la ventana de información abierta: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); });
fuente
Debe realizar un seguimiento de su objeto InfoWindow anterior
y llamar al método de cierre cuando maneja el evento de clic en un nuevo marcador.NB: No es necesario llamar a cerrar en el objeto de la ventana de información compartida, llamar a abrir con un marcador diferente cerrará automáticamente el original. Vea la respuesta de Daniel para más detalles.
fuente
close()
método, siInfoWindow
se usa un solo objeto. Se cerrará automáticamente siopen()
se vuelve a llamar al método en el mismo objeto.Básicamente, desea una función que mantenga la referencia a uno
new InfoBox()
=> delegar el evento onclick. Mientras crea sus marcadores (en un bucle) usebindInfoBox(xhr, map, marker);
// @param(project): xhr : data for infoBox template // @param(map): object : google.maps.map // @param(marker): object : google.maps.marker bindInfoBox: (function () { var options = $.extend({}, cfg.infoBoxOptions, { pixelOffset: new google.maps.Size(-450, -30) }), infoBox = new window.InfoBox(options); return function (project, map, marker) { var tpl = renderTemplate(project, cfg.infoBoxTpl); // similar to Mustache, Handlebars google.maps.event.addListener(marker, 'click', function () { infoBox.setContent(tpl); infoBox.open(map, marker); }); }; }())
var infoBox
se asigna de forma asincrónica y se guarda en la memoria. Cada vez que llame, se llamará abindInfoBox()
la función de retorno. También es útil para pasar elinfoBoxOptions
solo una vez!En mi ejemplo, tuve que agregar un parámetro adicional al
map
ya que mi inicialización se retrasa por eventos de pestaña.InfoBoxOptions
fuente
Aquí hay una solución que no necesita crear solo una ventana de información para reutilizarla. Puede continuar creando muchas infoWindows, lo único que necesita es crear una función closeAllInfoWindows y llamarla antes de abrir una nueva ventana de información. Entonces, manteniendo su código, solo necesita:
Cree una matriz global para almacenar toda la información de Windows
var infoWindows = [];
Almacene cada nueva ventana de información en la matriz, justo después de la ventana de información = nueva ...
Crear la función closeAllInfoWindows
function closeAllInfoWindows() { for (var i=0;i<infoWindows.length;i++) { infoWindows[i].close(); } }
En su código, llame a closeAllInfoWindows () justo antes de abrir la ventana de información.
Saludos,
fuente
Lo resolvió 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);
fuente
Google Maps le permite tener solo una ventana de información abierta. Entonces, si abre una nueva ventana, la otra se cierra automáticamente.
fuente