2012-02-17 14 views
8

Desarrollado con Google Maps v3.Ícono de marcador personalizado de Google Maps v3 no mantiene su posición en el mapa

Por alguna razón, mi ícono de marcador personalizado "cambia" la posición de acercamiento o alejamiento. Parece que tiene algún tipo de propiedad de "relleno", que no cambia junto con el zoom.

Significa que su posición es correcta en el zoom máximo (18), pero si cambio el valor del zoom, se "mueve" un poco hacia arriba, y crea problemas en los valores de zoom más pequeños, porque parece que no en la misma posición que está.

marcador se define como:

var image = new google.maps.MarkerImage('img/antennas/img.png',new google.maps.Size(100, 100)); 

Esto tal vez puede ayudar: forma icono del marcador se eleva al cuadrado, 100x100px, y su centro se encuentra en medio de la imagen, no en el fondo como marcadores "normales".

ACTUALIZACIÓN: ¿Tengo que hacer algo con la propiedad de ancla?

Respuesta

1

Basado en su descripción de "relleno", esto suena como que es un problema con el posicionamiento de su MarkerImage. Intente ajustar la propiedad de anclaje de MarkerImage. Por defecto, el ancla está en el centro inferior de su imagen. Si desea que la imagen esté centrada, deberá mover el ancla hasta la mitad del tamaño de la imagen para centrarla.

Ver http://code.google.com/intl/no/apis/maps/documentation/javascript/reference.html#MarkerImage de referencia.

3

En lugar de usar solo un Marcador, use también un MarkerImage, para usar como marcador.

En este ejemplo utilizo una marca que es un círculo con un punto en el centro, por lo que siempre quiero que esté centrado.

Ejemplo

var marker_image = new google.maps.MarkerImage(
     '../Media/icon_maps_marker.png', 
     null, 
     // The origin for my image is 0,0. 
     new google.maps.Point(0, 0), 
     // The center of the image is 50,50 (my image is a circle with 100,100) 
     new google.maps.Point(50, 50) 
    ); 
    var marker = new google.maps.Marker({ 
     clickable: true, 
     map: map, 
     position: center_location, 
     icon: marker_image, 
    }); 
0

Ver la propiedad en el icono de ancla: Ancla: nueva google.maps.Point (0, 0)

var icon = { 
    url: image, 
    anchor: new google.maps.Point(0, 0) 
    }; 

    marker = new google.maps.Marker({ 
    position: Latlng, 
    map: map, 
    icon: icon, 
    optimized: false 
    }); 
Cuestiones relacionadas