2011-11-23 10 views
34

El siguiente ejemplo muestra un marcador simple (icono estándar) en Google Maps para la ubicación y al hacer clic en el icono, abre la ventana de información. ¿Puedo mostrar la ventana de información abierta de manera predeterminada para que no tenga que hacer clic en el ícono para abrir?Google maps abrir ventana de información de forma predeterminada?

var myLatlng = new google.maps.LatLng(-25.363882,131.044922); 
    var myOptions = { 
    zoom: 4, 
    center: myLatlng, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
    } 

    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

    var contentString = '<div id="content">'+ 
     '<div id="siteNotice">'+ 
     '</div>'+ 
     '<h2 id="firstHeading" class="firstHeading">Uluru</h2>'+ 
     '</div>'; 

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

    var marker = new google.maps.Marker({ 
     position: myLatlng, 
     map: map, 
     title:"Uluru (Ayers Rock)" 
    }); 

    google.maps.event.addListener(marker, 'click', function() { 
    infowindow.open(map,marker); 
    }); 

Respuesta

69

Si desea mostrar la ventana de información se abre por defecto y sin clic, sólo tiene que añadir un nuevo código como abajo:

Su código:

google.maps.event.addListener(marker, 'click', function() { 
     infowindow.open(map,marker); 
}); 

Así que tenemos un nuevo código como esto:

google.maps.event.addListener(marker, 'click', function() { 
    infowindow.open(map,marker); 
}); 

infowindow.open(map,marker); 

Como se puede ver, sólo tiene que añadir una línea de código pequeño con infowindow.open(map,marker);

1

El código anterior funciona perfectamente. Sin embargo, mi mapa no se movió para que se mostrara completamente la ventana de información. En cambio, el marcador permaneció en el medio.

Entonces, ¿cómo hacer que el mapa se ajuste para que la ventana de información sea totalmente visible? Lea esto: Google Maps : auto center map on marker click

Si desea que el pasador de permanecer donde está y no cambiar el mapa, lee esto: Google Maps: How to prevent InfoWindow from shifting the map

Esperanza que ayuda a dar el siguiente paso

+0

Esto es simplemente genial! ¡Muchas gracias por publicar el segundo enlace! – berliner

15

Puede ejecutar "abrir" directamente en la carga de página debería abrir la ventana automáticamente, sin hacer clic.

infowindow.open(map, marker); 

Sin embargo, esto podría no autopan el mapa correctamente en algunos casos, dejando la parte superior de la superposición del borde del mapa.

Una forma en que trabajó para mí es lo envuelve en un oyente al evento "tilesloaded" en el mapa

google.maps.event.addListenerOnce(map, 'tilesloaded', function() { 
    infowindow.open(map, marker); 
}); 
+0

ESTA es la solución correcta, ¡gracias! He estado buscando durante horas, pero todas las demás soluciones centraban el marcador, no la ventana de información. – kissgyorgy

0

A continuación código está trabajando bien para mí:

Cambio latitud, longitud, Contenido y mapa (con su identificación div personalizada):

<script type="text/javascript"> 

function initialize() { 
    var myLatlng = new google.maps.LatLng(48.206615,13.487928); 
    var mapOptions = { 
     zoom: 16, 
     center: myLatlng, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    } 
    var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 

    var contentString = '<p><strong>Bahnhofstraße 32</strong></p><p>Bahnhofstraße 32, 4910 Ried im</p><p>Innkreis, Austria</p>'; 

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


    var marker = new google.maps.Marker({ 
     position: myLatlng, 
     map: map, 
     title: 'Bahnhofstraße 32' 
    }); 

    google.maps.event.addListener(marker, 'click', function() { 
    infowindow.open(map,marker); 
    }); 
    // show map, open infoBox 
     google.maps.event.addListenerOnce(map, 'tilesloaded', function() { 
      infowindow.open(map, marker); 
     }); 

} 

google.maps.event.addDomListener(window, 'load', initialize); 

    </script> 
Cuestiones relacionadas