Pregunta

En mi sitio, Estoy usando la API de Google Maps v3 lugar de la casa de los marcadores en el mapa.

El un infowindows permanecer abierto a menos que explícitamente haga clic en el icono cerrar.Es decir, puede haber 2+ un infowindows abrir en un tiempo si pasa el ratón sobre el marcador de mapa.

Pregunta:Cómo puedo hacer para que sólo la corriente activo InfoWindow está abierto y todos los demás un infowindows están cerradas?Significado, no más de 1 InfoWindow estará abierta durante un tiempo?

¿Fue útil?

Solución

Hay una close () función para las ventanas de información. Sólo mantener un registro de la última ventana abierta, y llamar a la función de cierre en él cuando se crea una nueva ventana.

Esta demo tiene la funcionalidad que usted está buscando. Lo encontré en la Maps API V3 galería de demostración .

Otros consejos

solución alternativa para esto con el uso de muchas ventanas de información: guardar prev abrió la ventana de información en una variable y luego cerrarla cuando se abre una nueva ventana

var prev_infowindow =false; 
...
base.attachInfo = function(marker, i){
    var infowindow = new google.maps.InfoWindow({
        content: 'yourmarkerinfocontent'
    });

    google.maps.event.addListener(marker, 'click', function(){
        if( prev_infowindow ) {
           prev_infowindow.close();
        }

        prev_infowindow = infowindow;
        infowindow.open(base.map, marker);
    });
}
//assuming you have a map called 'map'
var infowindow = new google.maps.InfoWindow();

var latlng1 = new google.maps.LatLng(0,0);
var marker1 = new google.maps.Marker({position:latlng1, map:map});
google.maps.event.addListener(marker1, 'click',
    function(){
        infowindow.close();//hide the infowindow
        infowindow.setContent('Marker #1');//update the content for this marker
        infowindow.open(map, marker1);//"move" the info window to the clicked marker and open it
    }
);
var latlng2 = new google.maps.LatLng(10,10);
var marker2 = new google.maps.Marker({position:latlng2, map:map});
google.maps.event.addListener(marker2, 'click',
    function(){
        infowindow.close();//hide the infowindow
        infowindow.setContent('Marker #2');//update the content for this marker
        infowindow.open(map, marker2);//"move" the info window to the clicked marker and open it
    }
);

Esto va a "mover" la ventana de información en torno a cada uno hace clic marcador, en efecto cerrarse, a continuación, volver a abrir (y paneo para adaptarse a la vista) en su nueva ubicación. Cambia su contenido antes de abrir para dar el efecto deseado. Que funciona para n marcadores.

Mi solución.

var map;
var infowindow = new google.maps.InfoWindow();
...
function createMarker(...) {
var marker = new google.maps.Marker({
     ...,
     descrip: infowindowHtmlContent  
});
google.maps.event.addListener(marker, 'click', function() {
    infowindow.setOptions({
        content: this.descrip,
        maxWidth:300
    });
    infowindow.open(map, marker);
});

A partir de este enlace http: //www.svennerberg. com / 2009/09 / google-maps-api-3-ventanas de información / :

  

Teo: La manera más fácil de hacer esto es   sólo hay una instancia de la   InfoWindow objetar que vuelve a utilizar durante   y otra vez. De esta forma cuando se   haga clic en un nuevo marcador de la infoWindow es   “Movido” desde donde es actualmente,   para señalar al nuevo marcador.

     

Utilice su método setContent para cargarlo   con el contenido correcto.

Hay una manera más fácil, además de utilizar la función close (). si se crea una variable con la propiedad InfoWindow que se cierra automáticamente cuando se abre otra.

var info_window;
var map;
var chicago = new google.maps.LatLng(33.84659, -84.35686);

function initialize() {
    var mapOptions = {
        center: chicago,
        zoom: 14,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);

    info_window = new google.maps.InfoWindow({
        content: 'loading'
    )};

createLocationOnMap('Location Name 1', new google.maps.LatLng(33.84659, -84.35686), '<p><strong>Location Name 1</strong><br/>Address 1</p>');
createLocationOnMap('Location Name 2', new google.maps.LatLng(33.84625, -84.36212), '<p><strong>Location Name 1</strong><br/>Address 2</p>');

}

function createLocationOnMap(titulo, posicao, conteudo) {            
    var m = new google.maps.Marker({
        map: map,
        animation: google.maps.Animation.DROP,
        title: titulo,
        position: posicao,
        html: conteudo
    });            

    google.maps.event.addListener(m, 'click', function () {                
        info_window.setContent(this.html);
        info_window.open(map, this);
    });
}
  

Declarar una variable para ventana activa

var activeInfoWindow; 
  

y enlazar este código en oyente marcador

 marker.addListener('click', function () {
    if (activeInfoWindow) { activeInfoWindow.close();}
    infowindow.open(map, marker);
    activeInfoWindow = infowindow;
});

¿Qué hay de -

google.maps.event.addListener(yourMarker, 'mouseover', function () {
        yourInfoWindow.open(yourMap, yourMarker);

    });

google.maps.event.addListener(yourMarker, 'mouseout', function () {
        yourInfoWindow.open(yourMap, yourMarker);

    });

A continuación, sólo puede flotar sobre ella y se cerrará.

var map;
var infowindow;
...
function createMarker(...) {
    var marker = new google.maps.Marker({...});
    google.maps.event.addListener(marker, 'click', function() {
        ...
        if (infowindow) {
            infowindow.close();
        };
        infowindow = new google.maps.InfoWindow({
            content: contentString,
            maxWidth: 300
        });
        infowindow.open(map, marker);
    }
...
function initialize() {
    ...
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    ...
    google.maps.event.addListener(map, 'click', function(event) {
        if (infowindow) {
            infowindow.close();
        };
        ...
    }
}

Almacené una variable en la parte superior para mantener un registro de qué ventana de información está abierto, véase más adelante.

var currentInfoWin = null;
google.maps.event.addListener(markers[counter], 'click', function() {      
    if (currentInfoWin !== null) {
        currentInfoWin.close(map, this); 
    }
    this.infoWin.open(map, this); 
    currentInfoWin = this.infoWin;  
}); 
var contentString = "Location: " + results[1].formatted_address;    
google.maps.event.addListener(marker,'click', (function(){ 
    infowindow.close();
    infowindow = new google.maps.InfoWindow({
        content: contentString
    });
    infowindow.open(map, marker);
}));
Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top