监听mapbox图层mousemove事件

最新推荐文章于 2024-05-27 20:05:09 发布

想一个不重名的名字

最新推荐文章于 2024-05-27 20:05:09 发布

阅读量408

点赞数 1

文章标签： javascript

本文链接：https://blog.csdn.net/qq_47099087/article/details/130865453

版权

方法一：

addMouseReact (id) {
    const self = this
    this.map.on('mousemove', id, (e) => {
    e.preventDefault()
    const features = self.map.queryRenderedFeatures(e.point, {
        layers: [id]
    })
    if (features.length > 0) {
        self.map.getCanvas().style.cursor = 'pointer'
    }
    })
    this.map.on('mouseleave', id, (e) => {
    self.map.getCanvas().style.cursor = 'grab'
    })
},

方法二：

map.on('mousemove', (e) => {
    const features = map.queryRenderedFeatures(e.point, { layers: ['cluster_point', 'point_blue', 'point_info'] })
    if (features.length > 0) {
        map.getCanvas().style.cursor = 'pointer'
    } else {
        map.getCanvas().style.cursor = ''
    }
})

对于几个图层可以这样一次性绑定，但对于很多个图层第二种方式无用，要用第一种方式遍历。