2012-02-17 10 views
8

Googleマップv3で開発する。Googleマップv3カスタムマーカーアイコンが地図上の位置を保持しない

私のカスタムマーカーアイコンは何らかの理由で、ズームイン時の位置を「変更」します。それはズームと一緒に変化しない、ある種の「パディング」プロパティを持っているようです。

最大ズーム(18)で位置が正しいことを意味しますが、ズーム値を変更すると、少し上に移動し、小さいズーム値で問題が発生しますそれと同じ位置にある。

マーカーは次のように定義されます。これは多分助けることができる

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

:マーカーアイコンは形状、100x100px二乗され、そしてそれは、中心だが、画像の真ん中ではなく、「正常な」マーカーなどの底にあります。

更新日:アンカープロパティで何かする必要がありますか?

答えて

5

マーカーのアンカーを設定する必要があります。デフォルトは中央下部です。それはあなたのMarkerImageのポジショニングに問題があるよう

は「パディング」のご説明に基づいて

1

http://code.google.com/apis/maps/documentation/javascript/reference.html#MarkerImageを参照してください、これが聞こえます。 MarkerImageのアンカープロパティを調整してみてください。デフォルトでは、アンカーは画像の下中央にあります。イメージを中央に配置するには、アンカーをイメージのサイズの半分だけ下に移動して中央に配置する必要があります。

参照のためにhttp://code.google.com/intl/no/apis/maps/documentation/javascript/reference.html#MarkerImageを参照してください。

3

Markerのみを使用する代わりに、MarkerImageを使用してマーカーとして使用します。

この例では、中央に点がある円であるマークを使用しています。そのため、常に中央に配置します。

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

アイコンでアンカープロパティを参照してください:アンカー:新しい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 
    }); 
関連する問題