Ikona znacznika Google Maps v3 nie zachowuje pozycji na mapie

Question

Rozwijanie za pomocą Google Maps v3.

Z jakiegoś powodu moja niestandardowa ikona znacznika "zmienia" jej pozycję przy powiększaniu obrazu. Wygląda na to, że ma jakąś właściwość "padding", która nie zmienia się wraz z zoomem.

Oznacza to, że pozycja jest prawidłowa dla maksymalnego zoomu (18), ale jeśli zmienię wartość powiększenia, "przesuwa się" nieco do góry, i sprawia problemy przy mniejszych wartościach zoomu, ponieważ wygląda na to, że nie jest w tej samej pozycji, w jakiej jest.

Marker jest zdefiniowany jako:

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

ten może pomoże: ikona znacznika kwadratu kształt, 100x100px, a to centrum jest w środku obrazu, a nie na dole jak „normalne” markerów.

AKTUALIZACJA: Czy muszę coś zrobić z własnością kotwicy?

Answer 1

Musisz ustawić kotwicę znacznika. Wartością domyślną jest środkowe dno.

Zobacz http://code.google.com/apis/maps/documentation/javascript/reference.html#MarkerImage

Answer 2

Na podstawie Twojego opisu „dopełnienie”, brzmi to jak to jest problem z pozycjonowaniem swojej MarkerImage. Spróbuj poprawić właściwości zakotwiczenia MarkerImage. Domyślnie zakotwiczenie znajduje się w dolnej środkowej części obrazu. Jeśli chcesz, aby obraz był wyśrodkowany, będziesz musiał przesunąć kotwę o połowę mniejszą niż obraz, aby ją wyśrodkować.

Dla porównania patrz http://code.google.com/intl/no/apis/maps/documentation/javascript/reference.html#MarkerImage.

Answer 3

Zamiast używać tylko markera, należy użyć MarkerImage jako znacznika.

W tym przykładzie używam znaku, który jest kołem z punktem pośrodku, więc zawsze chcę go wyśrodkować.

Przykład

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, 
    }); 

Answer 4

Patrz właściwości zakotwiczenia w ikony: stabilizującego: New 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 
    });