Question

如何基于mapboxgl在地图上实现要素查询，例如：单击道路，返回对应要素字段字段信息。

Answer 1

您好

您可以使用数据服务进行查询，查询方式为空间查询，参考代码如下：

      map.on('click', function (e) {
        if (map.getLayer('queryDatas')) {
          map.removeLayer('queryDatas')
        }
        if (map.getSource('queryDatas')) {
          map.removeSource('queryDatas')
        }
        let queryBufferGeometry = {
          type: 'Feature',
          geometry: {
            type: 'Point',
            coordinates: [e.lngLat.lng, e.lngLat.lat]
          }
        }

        const bufferParam = new mapboxgl.supermap.GetFeaturesByGeometryParameters({
          datasetNames: ['World:Countries'],
          geometry: queryBufferGeometry,
          spatialQueryMode: 'INTERSECT'
        })
        new mapboxgl.supermap.FeatureService(dataUrl).getFeaturesByGeometry(bufferParam, function (serviceResult) {
          map.addSource('queryDatas', {
            type: 'geojson',
            data: serviceResult.result.features
          })
          map.addLayer({
            id: 'queryDatas',
            type: 'fill',
            source: 'queryDatas',
            paint: {
              'fill-color': 'rgba(255, 0, 0, 0.6)',
              'fill-outline-color': '#2ae815'
            }
          })
          new mapboxgl.Popup().setText(serviceResult.result.features.features[0].properties.COUNTRY).setLngLat([e.lngLat.lng, e.lngLat.lat]).addTo(map)
        })

希望可以帮助到您！