La superposición de clics del marcador V2 a V3 de Google Maps no funciona (JQuery)

He estado trabajando en esto por un tiempo y simplemente no puedo resolverlo. Tengo un código de Google Maps que estoy tratando de traer a V3 desde V2. Tengo todo funcionando MENOS la superposición que reemplaza la ventana de información normal. Esta línea:

$("#infoCallout").appendTo(map.getPane(G_MAP_FLOAT_SHADOW_PANE));

Ya no funciona en V3. $("#infoCallout") es el div oculto. En este momento, la superposición solo aparece en la parte superior izquierda...

Mira lo que tengo hasta ahora aquí: http://empulseforum.com/brammoMapV3.php

Y trabajando en V2 muy bien aquí: http://brammoforum.com/brammo-owners-map.php

Siento que me estoy perdiendo algo fácil.

Gracias de antemano!

preguntado el 03 de mayo de 12 a las 16:05

2 Respuestas

Primero, cuando veo el nuevo sitio en su enlace, la página arroja: Error de referencia no detectado: el desplazamiento del marcador no está definido en la línea 73, que es (reformateada):

$("#infoCallout").fadeIn('slow').css({
    top:  markerOffset.y + -107,
    left: markerOffset.x - 40 });

Es fácil ver que este código nunca funcionará sin markerOffset, que no está definido porque el código de la línea anterior (línea 72) está comentado:

//var markerOffset = map.fromLatLngToDivPixel(markers.getPosition());

Entonces, debe descomentar el código en la línea 72 y refactorizarlo para que funcione a través de la API v3:

  1. La llamada interior: markers.getPosition() sigue siendo válido en v3; Hasta ahora, todo bien
  2. La llamada exterior: map.fromLatLngToDivPixel() ya no existe en v3; esta y otras llamadas relacionadas se han trasladado a la clase: google.maps.MapCanvasProjection. Se puede acceder a la proyección llamando a: OverlayView.getProjection().

Reuniéndolo, le sugiero que intente cambiar el código en el displayPoint función para:

function displayPoint( markers, index ) {
    map.panTo( markers.getPosition() );
    $("#infoCallout").hide();
    updateMemberInfo( pic[index], dN[index], bID[index], cS[index] );

    // Next 2 lines are new and replace the old line of code:
    var prjctn = overlay.getProjection();        
    var markerOffset = prjctn.fromLatLngToDivPixel( markers.getPosition() );

    $( "#infoCallout" ).fadeIn( 'slow' ).css({
        top:  markerOffset.y + -107,
        left: markerOffset.x -40
    });
}

Obviamente, este código no está probado, por lo que es posible que tenga que depurar, pero espero que este código lo lleve en la dirección correcta.

contestado el 04 de mayo de 12 a las 04:05

Utiliza SuperposiciónVista's fromLatLngToContainerPixel método.

contestado el 03 de mayo de 12 a las 19:05

¡Gracias por la respuesta! Tampoco creo que sea css, creo que tiene algo que ver con agregar el div (superposición) al "panel" del mapa. Simplemente no puedo entenderlo. - maricón

Eso obtiene la posición del marcador pero no ayuda con la superposición. - maricón

Lo siento, ¡escribí esa respuesta sobre CSS en la pregunta incorrecta! Debe mostrar la Superposición dentro de un OverlayView; luego se ubicará en relación con el mapa correctamente. - Chris pie ancho

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.