【解决办法】Leaflet点击查询MVT首先需要注册点击事件,具体实现可以参考博客:
https://blog.csdn.net/supermapsupport/article/details/127958630
查询要素属性可以参考如下代码实现:
$.get('http://localhost:8090/iserver/services/map-GanSuHuaNeng1/rest/maps/fullFigure@GanSuHuaNeng/tileFeature/vectorstyles.json?type=MapBox_GL&styleonly=true&tileURLTemplate=ZXY', function (style) {
style.layers[0].paint['background-color'] = 'rgba(168,209,221,0)'
var gl = L.mapboxGL({
renderWorldCopies: false,
style: style,
crs: 'EPSG:4326',
interactive: true,
// mapboxgl zoom 和leaflet zoom 差一级
minZoom: 1,
maxZoom: 13
}).addTo(map)
// 获取 mapboxgl 地图
var mapboxglMap = gl.getMapboxMap()
mapboxglMap.on('click', function (evt) {
const features = mapboxglMap.queryRenderedFeatures(evt.point)
const displayProperties = ['type', 'properties', 'id', 'layer', 'source', 'sourceLayer', 'state']
const displayFeatures = features.map((feat) => {
const displayFeat = {}
displayProperties.forEach((prop) => {
displayFeat[prop] = feat[prop]
})
return displayFeat
})
console.log(displayFeatures)
})
})