特定の大都市圏を示す画像 (円) があります。またGeoPosition
、関連するすべての分野を取得しています。
マーカーを配置すると、画像の下部中央がマーカーのGeoPosition
. しかし、空撮なので、画像にオフセットを与えたいので、円の画像の中心GeoPosition
はその位置にあります...
これを達成する方法はありますか?
ありがとう!
特定の大都市圏を示す画像 (円) があります。またGeoPosition
、関連するすべての分野を取得しています。
マーカーを配置すると、画像の下部中央がマーカーのGeoPosition
. しかし、空撮なので、画像にオフセットを与えたいので、円の画像の中心GeoPosition
はその位置にあります...
これを達成する方法はありますか?
ありがとう!
LeJaredのおかげで解決策が見つかりました。私の問題は、それMarkerImage
がMarker
. ただし、最初にイメージを定義し、後で に挿入する必要がありますMarker
。
例:
最初にイメージを定義します。
var image = new google.maps.MarkerImage("some/path/image.png",
// This marker is 20 pixels wide by 32 pixels tall.
null,
// The origin for this image is 0,0.
new google.maps.Point(0,0),
// The anchor for this image is the base of the flagpole at 0,32.
new google.maps.Point(75, 35)
);
次に、それを通常のマーカーに挿入します。
var myMarker = new google.maps.Marker({
position: myLatLng,
map: map,
icon: image,
title: "My Title",
});
Google API バージョン 3.11 以降、MarkerImage
に置き換えられましたIcon
。マーカーを 50px にスケーリングし、その中心が地理位置情報上になるように配置する新しい方法を次に示します。
var image = {
url: '/some/path/image.png',
origin: new google.maps.Point(0, 0),
anchor: new google.maps.Point(25, 25),
scaledSize: new google.maps.Size(50, 50)
};
var myMarker = new google.maps.Marker({
position: position,
icon: image,
title: 'title',
map: map
});
あなたのmarkerImageのアンカーポイントがどこにあるかを指定する必要があります。ドキュメントを参照してください: https://developers.google.com/maps/documentation/javascript/reference?hl=de#MarkerImage
Google が指定されていない場合、markerImage の下端の中心をアンカー ポイントと見なします。
正しいmarkerImageで複雑なマーカーを作成する方法のAPIドキュメントの例を次に示します: https://google-developers.appspot.com/maps/documentation/javascript/examples/icon-complex?hl=de
これが私の見解です。
new google.maps.Marker({
position: pos,
map: map,
icon: {
url: src,
anchor: new google.maps.Point(25, 25),
origin: new google.maps.Point(0, 0),
scaledSize: new google.maps.Size(50, 50)
}
});