包括3个图像在一个谷歌地图标记

Including 3 images inside one Google Maps Marker

本文关键字:谷歌 一个 地图 图标 图像 3个 包括      更新时间:2023-09-26

我正在尝试使用谷歌地图API完成此操作。我尝试了几个javascript插件,如google-maps-utility-library-v3的组件,但似乎没有真正做到这一点。

基本上我想做的是有一个阴影层,一个用户的图片层,在它上面的一个图层用于标记图像。我的标记图像有一个透明的洞,所以我想让用户的脸显示在那个洞里,这就是我为什么要这样做的原因。

我现在拥有的很简单:

var shadow = {
    url: '/data/images/map/pin_shadow.png',
    size: new google.maps.Size(108, 95),
    anchor: new google.maps.Point(30, 47)
};
var image = {
    url: '/data/images/map/pin.png',
    size: new google.maps.Size(60, 95),
    anchor: new google.maps.Point(30, 47)
};
var marker = new google.maps.Marker({
    position: new google.maps.LatLng(venue.lat, venue.lng),
    map: map,
    icon: image,
    shadow: shadow
});

我想知道是否有人曾经这样做过?

编辑:我更喜欢客户端解决方案。由于

我希望我可以在阴影和图像之间添加另一个图像。任何想法?

谢谢你,祝你有美好的一天!

你可以尝试这样做:

从PHP/. net/jsp/..动态创建pin图像

var image = {
    url: 'my_script.php?user=12345',
    size: new google.maps.Size(60, 95),
    anchor: new google.maps.Point(30, 47)
};

我不知道你用的是哪种语言,所以这里有一个脚本伪代码:

Set headers to print script as image
if image exists for specified user : 
    return this image;
else
    create image for user with the 3 layers
    return image
end if