Mapbox背景层点击事件不起作用

【问题标题】：Mapbox background layer click event not workingMapbox背景层点击事件不起作用
【发布时间】：2020-11-23 15:00:21
【问题描述】：

我正在尝试在 Mapbox 的透明背景层上设置点击事件。这是一个代码sn-p：

    map.on('load', function () {
          map.addLayer({
            id: 'transparent',
            type: 'background',
            interactive: true,
            paint: {
              'background-color': '#dedede',
              'background-opacity': 0
            }
    
          })
    }
    
    //This doesn't print Hello World to the console
    map.on('click', 'transparent', function () {
      console.log('Hello World')
    })

在符号图层上调用相同的事件没有问题。任何帮助将不胜感激。

【问题讨论】：

docs.mapbox.com/mapbox-gl-js/api/map/#map#on: "只有当它的位置在这个层的可见特征内时才会触发事件"。背景层中没有特征。

标签： events background click mapbox layer

【解决方案1】：

层指定源的样式。图层的类型由“类型”属性指定，并且必须是背景、填充、线条、符号、栅格、圆形、填充拉伸、热图、山体阴影之一。

除了背景类型的图层，每个图层都需要引用一个来源。

图层从源获取数据，可选择过滤特征，然后定义这些特征的样式。

我建议在地图上添加一个事件，例如：

map.on('click', function (e) {
//code
});

例子：

https://docs.mapbox.com/mapbox-gl-js/example/mouse-position/

如何添加背景层：

https://bl.ocks.org/stevage/a09dcbd11fb24b20033f2d3f6ab01374

【讨论】：