javascript - 谷歌地图：带有标记的可点击覆盖

Question

我想在 Google 地图上叠加 SVG，并使 SVG 的某些部分可点击。但是，我也希望可以在同一张地图上放置标记。这些应该出现在图像的顶部，我希望标记单击优先于 SVG 路径单击。

我已经在谷歌地图上放置了一个覆盖，完全按照这里的描述：https ://codepen.io/Shinxxxx/pen/wjEyMm

这正是我想要的。但是，请注意标记位于图像下方。然而，通过图像单击标记会执行标记的单击逻辑。

const marker = new window.google.maps.Marker({
    map: map,
    position: {lat: parseFloat(62.3), lng: parseFloat(-150.22)}
});
marker.addListener("click", () => {
    console.log("Oh hi Marker");
    map.setZoom(8);
    map.setCenter(marker.getPosition());
});

添加标记的相同示例： https ://codepen.io/maikelraow/pen/gOmdmdM

我尝试将 SVG 的图层从overlayMouseTarget 更改为overlayLayer，虽然这确实将其放在标记下方，但它也可以防止任何点击事件在 SVG 上触发。

标签： javascriptgoogle-maps