2012-04-07 9 views
5

Google Javascript Maps API 3.5Error de mapas: los marcadores se desplazan por todo el lugar cuando se cambian los ángulos de visión. ¿Fijar?

El problema básico es que si tiene un marcador que está sobre un punto fijo como una boca de incendios en la vista superior, cambia a 45 grados, el marcador ya no se muestra en la parte superior de la boca de riego Y viceversa (coloque el marcador en una vista de 45 grados y luego cambie a la parte superior).

para reproducir:

ver ejemplo aquí: www.zingjet.com/maptest.html

-Crear una página de Google Maps web básica con un marcador que pueden arrastrarse. Con la posición inicial del marcador/mapa sobre un área con imágenes de 45 grados disponibles: (prueba: 33.501472920248354, -82.01948559679795). No estoy seguro de que muestre este problema en todas las áreas, así que prueba ese punto para comenzar.

-Asegúrese de que has de cerca del máximo y en vista satélite

-apague 45 grados imaginería

-Posición marcador sobre el punto fijo (esquina de la acera, casa chimenea, etc)

-cambio a la vista de 45 grados.

-Nota que la posición del marcador se desplaza

-Trate girando el 45 grado y ver cómo marcador desplazamientos respecto punto original en la imagen.

- Cambie de nuevo a la parte superior y el marcador está en el lugar original.

Por qué es un problema: No sé en qué confiar. ¿Qué vista muestra la posición exacta para ese marcador? No se pueden crear páginas web que permitan a las personas ubicar marcadores en una vista y verlos en otra. Principales inconsistencias.

+1

¿Tiene código de muestra o jsFiddle? – hamczu

+0

la muestra está aquí: www.zingjet.com/maptest.html – Fraggle

+0

Creo que podría ser algo malo con este mapa en particular - si pone marcador en este mapa de [documentación] (https://google-developers.appspot.com/maps/documentation/javascript/examples/aerial-rotation) todo funciona como se esperaba – hamczu

Respuesta

1

Lo que probablemente tengas que hacer es hackearlo. En lo que respecta a Google, probablemente no haya ningún error y el punto en el mapa "aparezca" en un lugar diferente porque la vista de 45 grados cambia la perspectiva en el mapa y, por lo tanto, cómo un latitud discreta aparecerá físicamente en el mapa (cosas similares pueden suceder cuando el zoom cambia). Lo que debe hacer es averiguar qué es ese delta entre las vistas y luego enganchar el evento "tilt_changed" y ajustar su marcador de manera apropiada. Una buena manera fácil de aprender el delta es para enlazar el evento "dblclick" para alertar a usted el latlng el puntero del ratón está en:

google.maps.event.addDomListener(map, 'dblclick', function(MouseEvent){ 
     alert(MouseEvent.latLng.lat()+" "+MouseEvent.latLng.lng()); 
    }); 
// make sure you disable the maps default zoom on double click 
//or choose a different event or it will get annoying :) 

y luego DBLCLICK la pantalla donde el marcador "debe ser" y crear una función eso ajusta el marcador en consecuencia. En teoría, es posible que pueda definir una función que funcione en cualquier ángulo para que todo lo que tenga que hacer sea pasar la posición de cada marcador a través de la función en tilt_changed.Quiero saber si esto es un buen comienzo para ti :)

+0

Tenga en cuenta que necesito esto para trabajar con cualquier mapa, y para manejar vistas giradas (haga clic en 45 grados, luego gira el mapa). Google realmente debería estar manejando esto. Si tiene los cálculos para cambiar los marcadores, publique. Gracias. – Fraggle

3

ACTUALIZADO 2

 var map, marker, overlay, latlng, zoom = 20; 
     function initialize() { 
      latlng = new google.maps.LatLng(33.501472920248354, -82.01948559679795); 
      var myOptions = { 
       zoom : zoom, 
       center : latlng, 
       tilt : 0, 
       mapTypeId : google.maps.MapTypeId.SATELLITE 
      } 
      map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 
      overlay = new google.maps.OverlayView(); 
      overlay.draw = function() { 
      }; 
      overlay.onRemove = function() { 
      }; 
      overlay.setMap(map); 
      marker = new google.maps.Marker({ 
       position : latlng, 
       map : map, 
       draggable : true, 
       title : "Hello World!" 
      }); 

      google.maps.event.addListener(map, 'zoom_changed', function() { 
       zoom = map.getZoom(); 
      }); 

      google.maps.event.addListener(map, 'dragend', function() { 
       overlay.setMap(map); 
      }); 

      google.maps.event.addListener(marker, 'dragend', function(evt) { 
       var tilt = map.getTilt(); 
       latlng = new google.maps.LatLng(evt.latLng.lat(), evt.latLng.lng()); 
       if(tilt === 45) { 
        var projection = overlay.getProjection(); 
        var latlng2pixel = projection.fromLatLngToContainerPixel(marker.getPosition()); 

        var delta = 0; 
        switch(zoom) { 
         case 20: 
          delta = 45; 
          break; 
         case 19: 
          delta = 12; 
          break; 
         case 18: 
          delta = 4; 
          break; 
        } 
        latlng = projection.fromContainerPixelToLatLng(new google.maps.Point(latlng2pixel.x, (latlng2pixel.y + delta))); 
       } 
      }); 

      google.maps.event.addListener(map, 'tilt_changed', function() { 
       var tilt = map.getTilt(); 
       if(tilt === 45) { 
        var delta = 0; 
        switch(zoom) { 
         case 20: 
          delta = 65; 
          break; 
         case 19: 
          delta = 32; 
          break; 
         case 18: 
          delta = 16; 
          break; 
        } 
        var projection = overlay.getProjection(); 
        var latlng2pixel = projection.fromLatLngToContainerPixel(marker.getPosition()); 
        var pixel2latlng = projection.fromContainerPixelToLatLng(new google.maps.Point(latlng2pixel.x, (latlng2pixel.y - delta))); 
        marker.setPosition(pixel2latlng); 
       } else { 
        marker.setPosition(latlng); 
       } 
      }); 
     } 

NOTAS: El co de arriba funcionan de la siguiente manera:

  1. Aplicar una superposición personalizada para usar; google.maps.MapCanvasProjection objectdoc
  2. Encuentra la posición en píxeles del marcador;
  3. Agregue a y (arriba = lng) los 45 grados (45 pixel en el zoom 20) más 20 pixel de la altura del icono del marcador (x permanecen invariables ya que el cambio de grados es una ilusión óptica simple;));
  4. Convierta la posición de píxeles a una posición latlng válida;
  5. observe si el método tilt cambia de 0 a 45 y viceversa y actúe en consecuencia configurando las nuevas coordenadas.
+0

Esto es bastante bueno. No funciona si giro la vista en modo de 45 grados. Pero me da algo con lo que trabajar. Aunque ese valor 65 podría cambiar para diferentes ubicaciones de mapa, diferentes marcadores, etc. – Fraggle

Cuestiones relacionadas