Latest web development tutorials

Google Maps Evento

Haga clic en un marcador para magnificar - vinculante sobre eventos del mapa de Google.


Haga clic en un marcador de mapa zoom

Seguimos usando mapas en papel utilizando Londres.

Usuarios de puntos para lograr cuando el marcador se hace clic en la función de zoom (zoom marcador de ruta se hace clic acontecimiento de unión).

Código es el siguiente:

Ejemplos

// Zoom to 9 when clicking on marker
google.maps.event.addListener(marker,'click',function() {
map.setZoom(9);
map.setCenter(marker.getPosition());
});

Trate »

Utilizar addListener) gestor de eventos (para registrar un detector de eventos. El método utiliza un objeto, un evento para escuchar, cuando se produce un evento especificado, será llamado.


indicador de reposición

Añadimos un controlador de eventos al mapa para cambiar la propiedad "centro", utilice el código siguiente después de 3 segundos de eventos center_changed serán marcados centro de turno:

Ejemplos

google.maps.event.addListener(map,'center_changed',function() {
window.setTimeout(function() {
map.panTo(marker.getPosition());
},3000);
});

Trate »


Cuando se hace clic en el marcador para abrir la ventana de información.

Haga clic en un marcador para mostrar un texto en la ventana de mensajes:

Ejemplos

var infowindow = new google.maps.InfoWindow({
content:"Hello World!"
});

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

Trate »


Establecer la información de etiqueta y etiqueta para cada ventana abierta

La implementación de una ventana cuando el usuario hace clic en el mapa

Los usuarios hacen clic en el mapa para una función de posición placemarker () en el lugar designado para colocar un marcador, y pop-up ventana de mensajes:

Ejemplos

google.maps.event.addListener(map, 'click', function(event) {
placeMarker(event.latLng);
});

function placeMarker(location) {
var marker = new google.maps.Marker({
position: location,
map: map,
});
var infowindow = new google.maps.InfoWindow({
content: 'Latitude: ' + location.lat() +
'<br>Longitude: ' + location.lng()
});
infowindow.open(map,marker);
}

Trate »


Google Maps - Manual del Evento

Google Maps API Manual de Referencia .