如何解决如何完全删除移动网络上的谷歌地图标记可点击区域?
基本上我有一张地图,用户可以在其中点击以放置标记。但是当地图上已经有一个标记,而我尝试在附近放置一个标记时,该标记会拦截点击事件,因此地图无法接收它并放置另一个标记。我已将 clickable
设置为 false,并且没有为标记创建侦听器。
这只是移动设备上的问题 - 我通过将标记的形状设置为 0 x 0 像素矩形来修复它:
shape: {
type: 'rect',coords: [0,0]
}
此“形状”属性仅适用于桌面 - 当我使用 chrome 开发者工具设备模拟器加载页面时,设置可点击区域的 HTML area
元素不存在。
相反,标记上只有一个 div
元素和一个 img
元素。如果我将这些元素的高度和宽度设置为 0(使用检查元素),则地图能够接收标记上的点击事件!但我不知道如何使用 CSS 或 Javascript 来做到这一点,因为我看不到访问这些元素的方法。
问题似乎是当谷歌地图检测到移动设备时,它会通过标记 img
元素监听点击事件。在桌面上,它会创建一个 area
元素来获得点击。那么有什么方法可以编辑地图 API 创建的元素的高度和宽度吗?或者有没有其他方法可以在移动设备上设置标记的可点击区域?
要模拟我的问题,请按 ctrl+shift+I,然后按 ctrl+shift+M,然后在显示“响应式”的地方选择任何移动设备(iPad 最好,因为它更易于导航)。重新加载页面。点击地图以放置标记,然后点击该标记。然后,您可以关闭开发工具,重新加载页面,然后再次尝试放置两个标记,看看会发生什么。
解决方法
如果我删除这一行:
title: 'markertitle',
一切正常。出于某种原因,为标记添加标题会在其顶部创建一个拦截点击的元素。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。