mapbox - Mapbox gl:鼠标悬停在图层上时更改光标指针样式
问题描述
我有 10 到 15 个不同的图层,例如汽车、公共汽车、路线等。如果需要,我会在地图上添加动态图层,因为地图上始终不存在所有图层。
所以我在单击图层时显示信息,但是当我将鼠标悬停在图层上时,我想将鼠标指针光标样式更改为“十字准线”。
我已经在 mouseenter 事件上编写了更改光标样式,但它似乎有时可以工作,有时即使鼠标悬停在图层上,但光标样式不会改变。
第一种方式:
map.on('mouseenter', (e: any) => {
self.mapInstance.getCanvas().style.cursor = 'crosshair';
});
第二种方式:
map.on('mouseenter',(e: any) => {
var features = map.queryRenderedFeatures(e.point,{ layers: ['Car',"Bus"] });
//error let's say any layer still on exist on map
if(features.length)
map.getCanvas().style.cursor = 'crosshair';
});
我的问题:
光标样式没有改变
queryRenderedFeatures 上的错误,如层不存在
鼠标在悬停层上闪烁
如何在鼠标悬停在不同的不同图层上时更改光标的样式?
解决方案
map.on('mouseenter', 'clusters', () => {
map.getCanvas().style.cursor = 'pointer'
})
map.on('mouseleave', 'clusters', () => {
map.getCanvas().style.cursor = ''
})
这是如何让它专门与 clusers 一起工作,但代码可能仍然有帮助。
祝你好运 !
推荐阅读
- python - 特征工程中的拟合和拟合变换有什么区别?
- amazon-web-services - 现有 S3 的无服务器触发器因后缀重叠而失败
- php - centos php服务器上的文件上传错误日志
- authentication - 错误:LogonUser 失败,错误代码 1909
- python - 按照特定模式合并两个数据框
- bash - SLURM 上的数组和用户作业限制?
- php - php 的 date_create_from_format() 在验证期间返回 false
- c# - RDLC 文件的替代方案
- python - python同时运行多个代码
- flutter - 一种在 Future.catchError 上返回继承对象的方法