Google Maps Javascript V3:如何设置标记阴影与标记的偏移?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/7683046/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Google Maps Javascript V3: How can I Set the Marker Shadow's Offset from the Marker?
提问by Laxmidi
I've got a Google Map with a few different types of icons. I've got a shadow on each icon. How can I adjust the marker shadow's offset from the marker?
我有一个带有几种不同类型图标的 Google 地图。我在每个图标上都有一个阴影。如何调整标记阴影与标记的偏移?
In the loop that builds each marker, I've got:
在构建每个标记的循环中,我有:
var icon = customIcons[type];
var marker = new google.maps.Marker({
map: map,
position: point,
icon: icon.icon,
shadow: icon.shadow
});
The icon gets set by type.
图标按类型设置。
var customIcons = {
? Football: {
? ? icon: 'http://path-to-image1.png',
? ? shadow: 'http://path-to-shadow-image1.png'
? },
? Lacrosse: {
? ? icon: 'http://path-to-image2.png',
? ? shadow: 'http://path-to-shadow-image2.png'
? }
};
In this tutorial, they set the size and offset for a single icon as follows:
在本教程中,他们为单个图标设置了大小和偏移量,如下所示:
var image = new google.maps.MarkerImage('images/beachflag.png',
// This marker is 20 pixels wide by 32 pixels tall.
new google.maps.Size(20, 32),
// 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(0, 32));
var shadow = new google.maps.MarkerImage('images/beachflag_shadow.png',
// The shadow image is larger in the horizontal dimension
// while the position and offset are the same as for the main image.
new google.maps.Size(37, 32),
new google.maps.Point(0,0),
new google.maps.Point(0, 32));
In my situation, I've got multiple icons and they are set in an object. How can I add the size and offset to var customIcons
?
在我的情况下,我有多个图标,它们被设置在一个对象中。如何将大小和偏移量添加到var customIcons
?
Thank you.
谢谢你。
回答by Metablocks Corp
According to this piece of Google Map API v3 documentation:
根据这段Google Map API v3 文档:
Note: Marker shadows were removed in version 3.14 of the Google Maps JavaScript API. Any shadows specified programmatically will be ignored.
注意:Google Maps JavaScript API 3.14 版中删除了标记阴影。任何以编程方式指定的阴影都将被忽略。
回答by Nicolas Le Thierry d'Ennequin
See: https://developers.google.com/maps/documentation/javascript/reference#MarkerImage
请参阅:https: //developers.google.com/maps/documentation/javascript/reference#MarkerImage
The shadow image is a MarkerImage object. As such, its constructor can take an anchor
parameter (Point object) to tell how to position the shadow relative to your marker coordinates.
阴影图像是一个 MarkerImage 对象。因此,它的构造函数可以接受一个anchor
参数(Point 对象)来告诉如何相对于标记坐标定位阴影。
By default, the bottom-center point of MarkerImage is aligned on the marker coordinates. If your shadow image isn't the same size as your marker image (e. g. if it is wider) you will have to adjust the shadow's position.
默认情况下,MarkerImage 的底部中心点在标记坐标上对齐。如果您的阴影图像与标记图像的大小不同(例如,如果它更宽),您将不得不调整阴影的位置。