3

我有一个谷歌地图,在特定的纬度和经度上有一个圆圈。我还使用了一个我想显示在圆圈中心的标记,它应该是圆圈设置的 Lat 和 Lng。

这是我正在谈论的屏幕截图: 在此处输入图像描述

你可以看到“6”和“7”不在圆的中心。我不知道如何解决这个问题?

这是标记代码:

var markerIcon = [
                "img/marker-icon-1.png",
                "img/marker-icon-2.png",
                "img/marker-icon-3.png",
                "img/marker-icon-4.png",
                "img/marker-icon-5.png",
                "img/marker-icon-6.png",
                "img/marker-icon-7.png",
                "img/marker-icon-8.png",
                "img/marker-icon-9.png",
                "img/marker-icon-10.png"
            ];


var marker = new google.maps.Marker({
    position:new google.maps.LatLng(mapDataTrending[i].lat, mapDataTrending[i].lng),
    icon: markerIcon[i],
    map: map
});

我正在从 JSON 文件设置 Lat 和 Lng,但我使用相同的 Lat 和 Lng 来设置我的圆圈的中心。

4

2 回答 2

4

请注意,当您将图像作为标记放置时,图像的底部中心会转到所选的 latlng。您需要通过 Icon.anchor 属性调整图像大小(假设您正在谈论 google maps Javascript v3,因为您使用的是 icon )

https://developers.google.com/maps/documentation/javascript/reference#Icon

于 2013-02-21T14:47:13.393 回答
0

希望有人会发现这有助于寻找更多的复制粘贴答案。ICON_BASE允许您跨多个相同大小的图标复制它。

const ICON_BASE = {
    size: new google.maps.Size(16, 16), 
    origin: new google.maps.Point(0, 0),
    anchor: new google.maps.Point(8, 8)),
};

const ICON_1 = {
    ...ICON_BASE,
    url: "img/marker-icon-1.png",
};
于 2022-03-04T06:24:40.080 回答