2011-12-06 15 views
5

Actualmente estamos trabajando en un proyecto para actualizar Goole Maps API de v2 a v3 y nos encontramos con un problema y necesitamos confirmación sobre si es posible registrar múltiples oyentes en el mismo marcador . ¿Alguien puede confirmar si Goole Maps API v3 admite múltiples oyentes en el mismo marcador como API v2?Google Maps Api V3 - Asignación de varios oyentes al mismo objeto marcador

Código de ejemplo:

var mapObject = document.getElementById('map_canvas'); 
var points = new Array(); 
var markers = new Array(); 

var mapOptions = { 
    zoom: 16, 
    center: new google.maps.LatLng(33.260081, -117.279369), 
    mapTypeId: google.maps.MapTypeId.ROADMAP, 
    streetViewControl: false, 
    draggable: true, 
    scaleControl: false, 
    zoomControl: true,     
    panControl: true,      
    scrollwheel: false, 
    disableDoubleClickZoom: false, 
    navigationControlOptions: { 
    style: google.maps.NavigationControlStyle.ZOOM_PAN 
} 

map = new google.maps.Map(mapObject, mapOptions); 

points.push(lat:'33.260081', lng:'-117.279369'); 
points.push(lat:'33.260079', lng:'-117.279371'); 
points.push(lat:'33.260083', lng:'-117.279373'); 

for (var i in points) { 

    var point = points[i]; 

    var marker = initMarker(point); 

    markers.push(marker); 

    google.maps.event.addListener(marker, 'mouseover', function() { 
     alert('mouseover'); 
    }); 

    google.maps.event.addListener(marker, 'click', function() { 
     alert('click'); 
    }); 

    google.maps.event.addListener(marker, 'mouseout', function() { 
     alert('mouseout'); 
    }); 

    bounds.extend(new google.maps.LatLng(point.lat, point.lng)); 
} 

Cuando se ciernen sobre el marcador, se avisa con 'mouseout', luego 'mouseover' dos veces. Esperaría que acabara de alertar con 'mouseover' una vez.

Cuando hago clic en un marcador alerta con 'clic', luego 'mouseout', luego 'clic', luego 'mouseover'. Esperaría que solo alertara 'clic'.

Cuando desactivo 'mouseover' y 'mouseout', 'click' funciona como se esperaba. Y cuando deshabilito 'clic' y 'mouseout', 'mouseover' funciona como se esperaba.

¿Hay alguna razón por la cual estos eventos parecen encadenarse entre sí? En API v2, pudimos soportar esta funcionalidad sin problemas.

Gracias de antemano.

- Editar -

Esto sólo parece estar sucediendo en Firefox e IE, Chrome maneja los eventos como se esperaba.

- Editar -

he ido por delante y configuración 2 mapa demos por lo que una de lado a lado la comparación puede hacerse.

Versión 2 Url: http://map.ownij.com/index2.php

Versión 3 Url: http://map.ownij.com/

Versión 2 incluso el comportamiento oyente Firefox, IE, Chrome:

  • encima del ratón: pasar el ratón
  • haga clic en: haga clic en
  • mouseout: mouseOut

Versión 3 caso el comportamiento oyente Firefox, IE:

  • encima del ratón: mouseout, al pasar el ratón, ratón encima
  • clic: haga clic en, mouseout, haga clic
  • mouseout: mouseout, mouseout

Versión 3 incluso el comportamiento oyente Chrome:

  • encima del ratón: pasar el ratón
  • clic: haga clic
  • mouseout: mouseOut

Como se puede ver, el comportamiento de eventos v3 funciona como esperado en Chrome, pero en FF e IE, cada evento desencadena múltiples oyentes lo que resulta en comportamiento inusual.

Construimos nuestros mapas para permitir una burbuja mapa que aparezca cuando un usuario se desplaza sobre un marcador, por lo que cuando el ratón encima desencadena el evento mouseout, la burbuja vuelve a renderizar indefinidamente hasta que el usuario mueve el ratón fuera del marcador .

No podemos lanzar nuestra actualización v3 hasta que esto se haya resuelto, de lo contrario robamos a nuestros clientes la funcionalidad actual.

- Editar -

código actualizado, cambiando alertas a console.log() llama, el fuego de eventos como se esperaba. Parece que hay algún tipo de manejo inusual de eventos con respecto a las llamadas que no son de ventana (alertas, ebubble, etc.).

+0

El modelo de evento es ligeramente diferente entre los navegadores. De la mano no recuerdo cómo solucionar esto, pero recuerda que una vez que lees que tal vez cómo los eventos se disparan se puede cambiar ... –

+0

@YzmirRamirez: Desafortunadamente esto no tiene nada que ver con la burbuja de eventos, solo el manejo del evento de los navegadores, es por eso que opté por hacer alertas para eliminar cualquier distractor extraño. –

+1

Evite usar "alerta". La ventana emergente puede causar eventos adicionales como mouseover, mouseout, etc. - use 'console.log'. –

Respuesta

1

Terminé simplemente eliminando el oyente de desplazamiento y yendo con el oyente de clic. Eventualmente, le gustaría agregar la funcionalidad de vuelo estacionario, pero no tiene tiempo para rastrearla ahora.

1

Probablemente estos eventos adicionales sean causados ​​por alert. Intente registrar los eventos de una manera que no interactúe con el mouse, por ejemplo, usando console.log (aunque no estoy seguro si eso ya está disponible en el explorador de Internet).

Hablando en términos simples, mi suposición es que la ventana emergente hace que su mouse "mouseout" (y "mouseover" la ventana emergente). etc. los eventos adicionales entonces son probablemente causados ​​cuando la ventana emergente desaparece de nuevo.

+0

Tiene razón, cambié las alertas a console.log() y los eventos se desencadenan como se esperaba. Parece que cuando se usa una ventana que no es infowindow, dispara los eventos adicionales. Estoy intentando que funcione con una versión personalizada del plugin de ebubble. –

+0

Se supone que cualquier cosa en HTML causa eventos como mouseover y mouseout, por lo que no podrá trabajar realmente con estos, pero debe tratarlos con el significado que se pretende: el mouse está ahora en la ventana de información, no en el marcador . Sin embargo, una solución posible para usted es colocar la capa emergente * debajo * de la capa de destino del mapa. Entonces los eventos deberían funcionar como se esperaba, sin embargo, la interacción con la ventana emergente podría romperse ... –

+0

Lo que dices tiene sentido, lo que me cuelga es que los oyentes del evento en v2 funcionaron como se esperaba, incluso con el foco puesto en una ventana de información personalizada. –

Cuestiones relacionadas