mapbox鼠标滑到气泡中不关闭气泡。

贴个群号

WebGIS学习交流群461555818,欢迎大家

效果图

像官网这样的例子,我们并不能鼠标移动到上面的popup内容中,但是有时候是有这样的需求的,比如复制里面的值,或者里面加个按钮,可以点击出现弹窗,但是现在我们什么都无法做到,只能看这么一眼。

请添加图片描述
解决办法也很简单。
在.mapboxgl-popup类中修改一个属性pointer-events: auto;

  • 3
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
要修改Mapbox气泡窗口的样式,你可以使用以下方法: 1. 首先,初始化一个popupLayoutLayer对象,并将showAll参数设置为true,以便显示所有的气泡窗口。例如: ``` var popupLayoutLayer = new L.popupLayoutLayer({ showAll: true }).addTo(map); ``` 2. 接下来,你可以使用popupLayoutLayer对象的showPopup方法来展示所有的气泡窗口。例如: ``` popupLayoutLayer.showPopup(); ``` 3. 如果你想自定义气泡窗口的样式,你可以使用Mapbox的样式URL来修改。Mapbox提供了一些预定义的样式,比如streets、outdoors、light、dark、satellite等。你可以在样式URL的后面添加"/v9"来指定使用版本9的样式。例如: ``` mapbox://styles/mapbox/streets-v9 ``` 4. 你还可以在样式URL的后面添加其他参数来进一步定制气泡窗口的样式,比如添加导航样式"navigation-preview-day-v2"或"navigation-guidance-night-v2"等。例如: ``` mapbox://styles/mapbox/navigation-preview-day-v2 ``` 请注意,以上方法是根据引用[1]和引用提供的代码和信息进行的解答。如果你有其他的具体要求或者需要进一步的帮助,请提供更多的信息。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *3* [leaflet如何优雅的展示重叠点位的气泡窗口](https://blog.csdn.net/gisarmory/article/details/110957473)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] - *2* [Mapbox使用详解](https://blog.csdn.net/zhengang007/article/details/79170558)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值