diff --git a/src/views/sponeScreen/projectHM/ProjectDisplay.vue b/src/views/sponeScreen/projectHM/ProjectDisplay.vue index 1e20a77..f185734 100644 --- a/src/views/sponeScreen/projectHM/ProjectDisplay.vue +++ b/src/views/sponeScreen/projectHM/ProjectDisplay.vue @@ -93,6 +93,7 @@ let pointList = [], lineList = [], polygonList = []; + let bufferLine = []; if (code == 200) { data.forEach((element, index) => { element.fillcolor = colorList[typeList.indexOf(element.projectTypeCode)]; @@ -115,6 +116,10 @@ pointList.push(geometryToFrature); } else if (element.projectrange.includes('LINESTRING')) { lineList.push(geometryToFrature); + if (element.projectAbbreviation == '汴京路管网及道路海绵化改造') { + console.log('geometryToFrature---', geometryToFrature); + bufferLine = [turf.buffer(turf.lineString(geometryToFrature.geometry.coordinates[0]), 0.01)]; + } } else if (element.projectrange.includes('POLYGON')) { polygonList.push(geometryToFrature); } @@ -132,10 +137,26 @@ type: 'FeatureCollection', features: polygonList, }; + let bufferGeojson = { + type: 'FeatureCollection', + features: bufferLine, + }; // 项目名称图层 newfiberMapBoxVectorLayer.addGeojsonPolygonWithLabel('polygonGeojson', polygonGeojson, 12); newfiberMapBoxVectorLayer.addGeojsonLineWithLabel('lineGeojson', lineGeojson, 5, 12); newfiberMapBoxVectorLayer.addGeojsonCircleWithLabel('pointGeojson', pointGeojson, 12); + if (!newfiberMapbox.map.getLayer('projectBuffer')) { + newfiberMapbox.map.addSource('projectBuffer', { type: 'geojson', data: bufferGeojson }); + newfiberMapbox.map.addLayer({ + id: 'projectBuffer', + type: 'fill', + source: 'projectBuffer', + minzoom: 17, + paint: { + 'fill-color': 'rgba(21,230,228,0.4)', + }, + }); + } newfiberMapbox.map.moveLayer('point', 'pointGeojson'); } };