diff --git a/src/views/sponeScreen/HaiMianScreen/index.vue b/src/views/sponeScreen/HaiMianScreen/index.vue index 0d62ea6..587f591 100644 --- a/src/views/sponeScreen/HaiMianScreen/index.vue +++ b/src/views/sponeScreen/HaiMianScreen/index.vue @@ -140,6 +140,7 @@ import LongYW from '@/views/sponeScreen/longYW/index.vue'; //长效运维 import axios from 'axios'; import NewFiberMapUtils from '@/utils/gis/NewFiberMapUtils'; +import newfiberMapBoxVectorLayer from '@/views/sponeScreen/gisMF/mapboxVectorLayer.js'; import { onBeforeUnmount } from 'vue'; const { proxy } = getCurrentInstance(); @@ -175,6 +176,8 @@ function menuClick(id) { menuIndex.value = id; showPanel.value = false; + newfiberMapBoxVectorLayer.removeByIds(['bengzhan_Area']); //清除泵站范围 + bus.emit('closeCesiumPopup'); //关闭弹窗 } // 图例控制 function controlLegend() { @@ -200,6 +203,7 @@ //地图点击 const mapClick = (point, properties) => { console.log('地图点击---', properties); + newfiberMapBoxVectorLayer.removeByIds(['bengzhan_Area']); // 管网监测点 if (properties.type == 'pipeMonitor') { bus.emit('pipeMonitorBus', properties); @@ -213,6 +217,12 @@ properties.type == 'sewageFactory' || properties.type == 'waterLoging' ) { + //泵站范围 + if (properties.geometrys) { + let geometrysToMap = turf.featureCollection([turf.feature(Terraformer.WKT.parse(properties.geometrys), properties)]); + console.log('geometrysToMap---', geometrysToMap); + newfiberMapBoxVectorLayer.addGeojsonPolygon('bengzhan_Area', geometrysToMap); + } bus.emit('popupcontent', { popupShow: true, point: point, diff --git a/src/views/sponeScreen/HaiMianScreen/index.vue b/src/views/sponeScreen/HaiMianScreen/index.vue index 0d62ea6..587f591 100644 --- a/src/views/sponeScreen/HaiMianScreen/index.vue +++ b/src/views/sponeScreen/HaiMianScreen/index.vue @@ -140,6 +140,7 @@ import LongYW from '@/views/sponeScreen/longYW/index.vue'; //长效运维 import axios from 'axios'; import NewFiberMapUtils from '@/utils/gis/NewFiberMapUtils'; +import newfiberMapBoxVectorLayer from '@/views/sponeScreen/gisMF/mapboxVectorLayer.js'; import { onBeforeUnmount } from 'vue'; const { proxy } = getCurrentInstance(); @@ -175,6 +176,8 @@ function menuClick(id) { menuIndex.value = id; showPanel.value = false; + newfiberMapBoxVectorLayer.removeByIds(['bengzhan_Area']); //清除泵站范围 + bus.emit('closeCesiumPopup'); //关闭弹窗 } // 图例控制 function controlLegend() { @@ -200,6 +203,7 @@ //地图点击 const mapClick = (point, properties) => { console.log('地图点击---', properties); + newfiberMapBoxVectorLayer.removeByIds(['bengzhan_Area']); // 管网监测点 if (properties.type == 'pipeMonitor') { bus.emit('pipeMonitorBus', properties); @@ -213,6 +217,12 @@ properties.type == 'sewageFactory' || properties.type == 'waterLoging' ) { + //泵站范围 + if (properties.geometrys) { + let geometrysToMap = turf.featureCollection([turf.feature(Terraformer.WKT.parse(properties.geometrys), properties)]); + console.log('geometrysToMap---', geometrysToMap); + newfiberMapBoxVectorLayer.addGeojsonPolygon('bengzhan_Area', geometrysToMap); + } bus.emit('popupcontent', { popupShow: true, point: point, diff --git a/src/views/sponeScreen/cityGK/PhysicalGeography.vue b/src/views/sponeScreen/cityGK/PhysicalGeography.vue index 1f180d2..98a7ad2 100644 --- a/src/views/sponeScreen/cityGK/PhysicalGeography.vue +++ b/src/views/sponeScreen/cityGK/PhysicalGeography.vue @@ -276,10 +276,11 @@ let mapboxTimer = setInterval(() => { if (!newfiberMapbox) return; if (!newfiberMapbox.map.getLayer('kaifengWaterLabel1')) return; - newfiberMapBoxVectorLayer.addGeojsonPolygon('oneCenter', oneCenter); - newfiberMapBoxVectorLayer.addGeojsonPolygonWithLabel('oneCenter1', oneCenter1, 0, 2); - newfiberMapBoxVectorLayer.addGeojsonPolygon('oneCenter2', oneCenter2); - newfiberMapBoxVectorLayer.addLabelAlongLine('oneCenter3', oneCenter3); + newfiberMapbox.map.setLayoutProperty('hn_kf_hm_dltb', 'visibility', 'visible'); + // newfiberMapBoxVectorLayer.addGeojsonPolygon('oneCenter', oneCenter); + // newfiberMapBoxVectorLayer.addGeojsonPolygonWithLabel('oneCenter1', oneCenter1, 0, 2); + // newfiberMapBoxVectorLayer.addGeojsonPolygon('oneCenter2', oneCenter2); + // newfiberMapBoxVectorLayer.addLabelAlongLine('oneCenter3', oneCenter3); newfiberMapbox.map.setLayoutProperty('kaifengWaterLabel1', 'visibility', 'none'); newfiberMapbox.map.setLayoutProperty('kaifengWaterLabel2', 'visibility', 'none'); clearInterval(mapboxTimer); diff --git a/src/views/sponeScreen/HaiMianScreen/index.vue b/src/views/sponeScreen/HaiMianScreen/index.vue index 0d62ea6..587f591 100644 --- a/src/views/sponeScreen/HaiMianScreen/index.vue +++ b/src/views/sponeScreen/HaiMianScreen/index.vue @@ -140,6 +140,7 @@ import LongYW from '@/views/sponeScreen/longYW/index.vue'; //长效运维 import axios from 'axios'; import NewFiberMapUtils from '@/utils/gis/NewFiberMapUtils'; +import newfiberMapBoxVectorLayer from '@/views/sponeScreen/gisMF/mapboxVectorLayer.js'; import { onBeforeUnmount } from 'vue'; const { proxy } = getCurrentInstance(); @@ -175,6 +176,8 @@ function menuClick(id) { menuIndex.value = id; showPanel.value = false; + newfiberMapBoxVectorLayer.removeByIds(['bengzhan_Area']); //清除泵站范围 + bus.emit('closeCesiumPopup'); //关闭弹窗 } // 图例控制 function controlLegend() { @@ -200,6 +203,7 @@ //地图点击 const mapClick = (point, properties) => { console.log('地图点击---', properties); + newfiberMapBoxVectorLayer.removeByIds(['bengzhan_Area']); // 管网监测点 if (properties.type == 'pipeMonitor') { bus.emit('pipeMonitorBus', properties); @@ -213,6 +217,12 @@ properties.type == 'sewageFactory' || properties.type == 'waterLoging' ) { + //泵站范围 + if (properties.geometrys) { + let geometrysToMap = turf.featureCollection([turf.feature(Terraformer.WKT.parse(properties.geometrys), properties)]); + console.log('geometrysToMap---', geometrysToMap); + newfiberMapBoxVectorLayer.addGeojsonPolygon('bengzhan_Area', geometrysToMap); + } bus.emit('popupcontent', { popupShow: true, point: point, diff --git a/src/views/sponeScreen/cityGK/PhysicalGeography.vue b/src/views/sponeScreen/cityGK/PhysicalGeography.vue index 1f180d2..98a7ad2 100644 --- a/src/views/sponeScreen/cityGK/PhysicalGeography.vue +++ b/src/views/sponeScreen/cityGK/PhysicalGeography.vue @@ -276,10 +276,11 @@ let mapboxTimer = setInterval(() => { if (!newfiberMapbox) return; if (!newfiberMapbox.map.getLayer('kaifengWaterLabel1')) return; - newfiberMapBoxVectorLayer.addGeojsonPolygon('oneCenter', oneCenter); - newfiberMapBoxVectorLayer.addGeojsonPolygonWithLabel('oneCenter1', oneCenter1, 0, 2); - newfiberMapBoxVectorLayer.addGeojsonPolygon('oneCenter2', oneCenter2); - newfiberMapBoxVectorLayer.addLabelAlongLine('oneCenter3', oneCenter3); + newfiberMapbox.map.setLayoutProperty('hn_kf_hm_dltb', 'visibility', 'visible'); + // newfiberMapBoxVectorLayer.addGeojsonPolygon('oneCenter', oneCenter); + // newfiberMapBoxVectorLayer.addGeojsonPolygonWithLabel('oneCenter1', oneCenter1, 0, 2); + // newfiberMapBoxVectorLayer.addGeojsonPolygon('oneCenter2', oneCenter2); + // newfiberMapBoxVectorLayer.addLabelAlongLine('oneCenter3', oneCenter3); newfiberMapbox.map.setLayoutProperty('kaifengWaterLabel1', 'visibility', 'none'); newfiberMapbox.map.setLayoutProperty('kaifengWaterLabel2', 'visibility', 'none'); clearInterval(mapboxTimer); diff --git a/src/views/sponeScreen/cityGK/index.vue b/src/views/sponeScreen/cityGK/index.vue index e8a299f..9dd2898 100644 --- a/src/views/sponeScreen/cityGK/index.vue +++ b/src/views/sponeScreen/cityGK/index.vue @@ -48,9 +48,9 @@ ); onMounted(() => { - setTimeout(() => { - newfiberMapBoxVectorLayer.addMapboxWeather(); - }, 6000); + // setTimeout(() => { + // newfiberMapBoxVectorLayer.addMapboxWeather(); + // }, 6000); // newfiberMap.setView({ // lng: 114.312, // lat: 34.502, diff --git a/src/views/sponeScreen/HaiMianScreen/index.vue b/src/views/sponeScreen/HaiMianScreen/index.vue index 0d62ea6..587f591 100644 --- a/src/views/sponeScreen/HaiMianScreen/index.vue +++ b/src/views/sponeScreen/HaiMianScreen/index.vue @@ -140,6 +140,7 @@ import LongYW from '@/views/sponeScreen/longYW/index.vue'; //长效运维 import axios from 'axios'; import NewFiberMapUtils from '@/utils/gis/NewFiberMapUtils'; +import newfiberMapBoxVectorLayer from '@/views/sponeScreen/gisMF/mapboxVectorLayer.js'; import { onBeforeUnmount } from 'vue'; const { proxy } = getCurrentInstance(); @@ -175,6 +176,8 @@ function menuClick(id) { menuIndex.value = id; showPanel.value = false; + newfiberMapBoxVectorLayer.removeByIds(['bengzhan_Area']); //清除泵站范围 + bus.emit('closeCesiumPopup'); //关闭弹窗 } // 图例控制 function controlLegend() { @@ -200,6 +203,7 @@ //地图点击 const mapClick = (point, properties) => { console.log('地图点击---', properties); + newfiberMapBoxVectorLayer.removeByIds(['bengzhan_Area']); // 管网监测点 if (properties.type == 'pipeMonitor') { bus.emit('pipeMonitorBus', properties); @@ -213,6 +217,12 @@ properties.type == 'sewageFactory' || properties.type == 'waterLoging' ) { + //泵站范围 + if (properties.geometrys) { + let geometrysToMap = turf.featureCollection([turf.feature(Terraformer.WKT.parse(properties.geometrys), properties)]); + console.log('geometrysToMap---', geometrysToMap); + newfiberMapBoxVectorLayer.addGeojsonPolygon('bengzhan_Area', geometrysToMap); + } bus.emit('popupcontent', { popupShow: true, point: point, diff --git a/src/views/sponeScreen/cityGK/PhysicalGeography.vue b/src/views/sponeScreen/cityGK/PhysicalGeography.vue index 1f180d2..98a7ad2 100644 --- a/src/views/sponeScreen/cityGK/PhysicalGeography.vue +++ b/src/views/sponeScreen/cityGK/PhysicalGeography.vue @@ -276,10 +276,11 @@ let mapboxTimer = setInterval(() => { if (!newfiberMapbox) return; if (!newfiberMapbox.map.getLayer('kaifengWaterLabel1')) return; - newfiberMapBoxVectorLayer.addGeojsonPolygon('oneCenter', oneCenter); - newfiberMapBoxVectorLayer.addGeojsonPolygonWithLabel('oneCenter1', oneCenter1, 0, 2); - newfiberMapBoxVectorLayer.addGeojsonPolygon('oneCenter2', oneCenter2); - newfiberMapBoxVectorLayer.addLabelAlongLine('oneCenter3', oneCenter3); + newfiberMapbox.map.setLayoutProperty('hn_kf_hm_dltb', 'visibility', 'visible'); + // newfiberMapBoxVectorLayer.addGeojsonPolygon('oneCenter', oneCenter); + // newfiberMapBoxVectorLayer.addGeojsonPolygonWithLabel('oneCenter1', oneCenter1, 0, 2); + // newfiberMapBoxVectorLayer.addGeojsonPolygon('oneCenter2', oneCenter2); + // newfiberMapBoxVectorLayer.addLabelAlongLine('oneCenter3', oneCenter3); newfiberMapbox.map.setLayoutProperty('kaifengWaterLabel1', 'visibility', 'none'); newfiberMapbox.map.setLayoutProperty('kaifengWaterLabel2', 'visibility', 'none'); clearInterval(mapboxTimer); diff --git a/src/views/sponeScreen/cityGK/index.vue b/src/views/sponeScreen/cityGK/index.vue index e8a299f..9dd2898 100644 --- a/src/views/sponeScreen/cityGK/index.vue +++ b/src/views/sponeScreen/cityGK/index.vue @@ -48,9 +48,9 @@ ); onMounted(() => { - setTimeout(() => { - newfiberMapBoxVectorLayer.addMapboxWeather(); - }, 6000); + // setTimeout(() => { + // newfiberMapBoxVectorLayer.addMapboxWeather(); + // }, 6000); // newfiberMap.setView({ // lng: 114.312, // lat: 34.502, diff --git a/src/views/sponeScreen/gisMF/cesiumPopup.vue b/src/views/sponeScreen/gisMF/cesiumPopup.vue index 108d45a..24548d8 100644 --- a/src/views/sponeScreen/gisMF/cesiumPopup.vue +++ b/src/views/sponeScreen/gisMF/cesiumPopup.vue @@ -126,6 +126,7 @@ import bus from '@/bus'; import chartOption from '@/components/Echarts/pieChart_1.js'; import { graphicReport, getoneRiverRisk } from '@/api/dataAnalysis/syntherticData'; +import newfiberMapBoxVectorLayer from '@/views/sponeScreen/gisMF/mapboxVectorLayer.js'; import * as echarts from 'echarts'; const { proxy } = getCurrentInstance(); @@ -143,8 +144,9 @@ // function closePopupCES() { + newfiberMapBoxVectorLayer.removeByIds(['bengzhan_Area']); //清除泵站范围 allData.popupShow = false; - bus.emit('closeCesiumPopup'); + // 关闭之后回到中心点 newfiberMapbox.map.easeTo({ center: [114.344, 34.802], @@ -304,6 +306,9 @@ } onMounted(() => { + bus.on('closeCesiumPopup', () => { + allData.popupShow = false; + }); bus.on('popupcontent', params => { console.log('popup接收地图标注点值---111', params); allData.dataList = params.popupInfo; @@ -342,6 +347,7 @@ }); onBeforeUnmount(() => { bus.off('popupcontent'); + bus.off('closeCesiumPopup'); });