首页 / 浏览问题 / WebGIS / 问题详情
超图FAQ:请教一下,用leaflet如何对接矢量瓦片并支持点击查询属性信息[抱拳]
55,378EXP 2024年10月14日

请教一下,用leaflet如何对接矢量瓦片并支持点击查询属性信息[抱拳]

1个回答

【解决办法】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) }) })
55,378EXP 2024年10月14日
...