From 51c198eb02d961a3138bb2486b00b86335779275 Mon Sep 17 00:00:00 2001 From: zhangquan <2523589960@qq.com> Date: Sat, 2 Aug 2025 17:02:59 +0800 Subject: [PATCH] =?UTF-8?q?1.=E5=9F=BA=E7=A1=80=E7=BB=98=E5=88=B6=E4=B8=AD?= =?UTF-8?q?=E7=9A=84=E4=BD=8D=E7=BD=AE=E7=82=B9=E3=80=81=E6=8A=98=E7=BA=BF?= =?UTF-8?q?=E3=80=81=E5=A4=9A=E8=BE=B9=E5=BD=A2=E3=80=81=E6=9B=B2=E9=9D=A2?= =?UTF-8?q?=EF=BC=8C=E6=B7=BB=E5=8A=A0=E7=BB=8F=E7=BA=AC=E5=BA=A6=E3=80=81?= =?UTF-8?q?=E9=95=BF=E5=BA=A6=E3=80=81=E9=9D=A2=E7=A7=AF=E7=AD=89=E5=B1=9E?= =?UTF-8?q?=E6=80=A7=EF=BC=9B2.=E6=B7=BB=E5=8A=A0=E7=99=BD=E5=90=8D?= =?UTF-8?q?=E5=8D=95=EF=BC=8C=E7=B1=BB=E5=9E=8B=E5=9C=A8=E5=85=B6=E4=B8=AD?= =?UTF-8?q?=E7=9A=84=E5=9C=B0=E5=9B=BE=E8=A6=81=E7=B4=A0=E6=89=8D=E8=83=BD?= =?UTF-8?q?=E8=A2=AB=E9=80=89=E6=8B=A9=EF=BC=9B=E9=BC=A0=E6=A0=87=E7=A7=BB?= =?UTF-8?q?=E5=8A=A8=E5=88=B0=E5=8F=AF=E9=80=89=E5=9C=B0=E5=9B=BE=E8=A6=81?= =?UTF-8?q?=E7=B4=A0=E6=97=B6=E5=9B=BE=E6=A0=87=E5=8F=98=E5=8C=96=EF=BC=9B?= =?UTF-8?q?3.=E4=BC=98=E5=8C=96=E4=BB=A3=E7=A0=81=EF=BC=9B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../mixins/useMeasureTool/measureArea.js | 3 +- .../mixins/useMeasureTool/measureDistance.js | 4 +- .../forestFire/DialogPropertyGrid/property.js | 95 +++++++++++++++++-- .../forestFire/Toolbar/Toolbar.vue | 61 +++++++++++- .../forestFire/Toolbar/baseDraw.js | 23 ++++- .../forestFire/Toolbar/forestFireDraw.js | 4 + 6 files changed, 177 insertions(+), 13 deletions(-) diff --git a/src/components/CesiumMap/mixins/useMeasureTool/measureArea.js b/src/components/CesiumMap/mixins/useMeasureTool/measureArea.js index 93cc91d..b1aa557 100644 --- a/src/components/CesiumMap/mixins/useMeasureTool/measureArea.js +++ b/src/components/CesiumMap/mixins/useMeasureTool/measureArea.js @@ -13,7 +13,7 @@ export const measureArea = (deps) => { // 临时多边形实体 (包含填充和边界线) const tempPolygon = new Cesium.Entity({ - name: '__draw_temp_polygon', + name: '__measure_temp_polygon', position: new Cesium.CallbackProperty(() => { if (featurePositions.length < 2) return null @@ -113,6 +113,7 @@ export const measureArea = (deps) => { } // 绘制完成的面积测量实体 measureLayer.entities.add({ + name: '__measure_area', position: getBoundingCenter(featurePositions), label: { text: `${getArea(featurePositions).toFixed(2)}平方米`, diff --git a/src/components/CesiumMap/mixins/useMeasureTool/measureDistance.js b/src/components/CesiumMap/mixins/useMeasureTool/measureDistance.js index c7fde6a..a88c2fd 100644 --- a/src/components/CesiumMap/mixins/useMeasureTool/measureDistance.js +++ b/src/components/CesiumMap/mixins/useMeasureTool/measureDistance.js @@ -21,7 +21,7 @@ export const measureDistance = (deps) => { // 临时折线实体 const tempPolyline = new Cesium.Entity({ - name: "__draw_temp_polyline", + name: "__measure_temp_polyline", position: new Cesium.CallbackProperty(() => { if (featurePositions.length === 0) return null // 获取最后一个位置和当前鼠标位置的中点，作为标签显示位置 @@ -101,6 +101,7 @@ export const measureDistance = (deps) => { ]; // 当至少有2个点时，添加最后2个点的折线 subDistance.push({ + name: '__measure_distance_sub', entity: measureLayer.entities.add(new Cesium.Entity({ position: getBoundingCenter(positions), label: { @@ -138,6 +139,7 @@ export const measureDistance = (deps) => { // 绘制总长标签 measureLayer.entities.add(new Cesium.Entity({ + name: '__measure_distance_label', position: featurePositions[featurePositions.length - 1], label: { text: `总距离：${subDistance.reduce((total, d) => total + d.distance, 0).toFixed(2)}米`, diff --git a/src/views/systemTemplate/forestFire/DialogPropertyGrid/property.js b/src/views/systemTemplate/forestFire/DialogPropertyGrid/property.js index 6275388..caa413c 100644 --- a/src/views/systemTemplate/forestFire/DialogPropertyGrid/property.js +++ b/src/views/systemTemplate/forestFire/DialogPropertyGrid/property.js @@ -1,5 +1,84 @@ import * as Cesium from 'cesium' +// 定义定位的属性 +export const location = [ + { + key: "type", + name: "要素类型", + type: "text", + value: "位置点", + disabled: true, + }, + { + key: "longitude", + name: "经度", + type: "text", + value: "0", + disabled: true, + }, + { + key: "latitude", + name: "纬度", + type: "text", + value: "0", + disabled: true, + }, +]; + +// 定义折线的属性 +export const polyline = [ + { + key: "type", + name: "要素类型", + type: "text", + value: "折线", + disabled: true, + }, + { + key: "length", + name: "长度（m）", + type: "text", + value: "0", + disabled: true, + }, +]; + +// 定义多边形的属性 +export const polygon = [ + { + key: "type", + name: "要素类型", + type: "text", + value: "多边形", + disabled: true, + }, + { + key: "area", + name: "面积（m²）", + type: "text", + value: "0", + disabled: true, + }, +]; + +// 定义曲面的属性 +export const curvePolygon = [ + { + key: "type", + name: "要素类型", + type: "text", + value: "曲面", + disabled: true, + }, + { + key: "area", + name: "面积（m²）", + type: "text", + value: "0", + disabled: true, + }, +]; + // 定义火情点的属性 export const warning = [ { @@ -53,7 +132,7 @@ export const warning = [ }, { key: "fireArea", - name: "火灾面积", + name: "火灾面积（m²）", type: "text", value: "", disabled: false, @@ -117,7 +196,7 @@ export const track = [ }, { key: "length", - name: "长度", + name: "长度（m）", type: "text", value: "", disabled: true, @@ -453,7 +532,7 @@ export const watersource = [ }, { key: "area", - name: "占地面积", + name: "占地面积（m²）", type: "text", value: "0", disabled: true, @@ -556,14 +635,14 @@ export const road = [ }, { key: "length", - name: "道路长度", + name: "道路长度（m）", type: "text", value: "", disabled: true, }, { key: "width", - name: "道路宽度", + name: "道路宽度（m）", type: "text", value: "", disabled: false, @@ -588,7 +667,7 @@ export const keyarea = [ }, { key: "area", - name: "占地面积", + name: "占地面积（m²）", type: "text", value: "0", disabled: true, @@ -631,6 +710,10 @@ export const keyarea = [ ]; const config = { + location, + polyline, + polygon, + curvePolygon, warning, track, ranger, diff --git a/src/views/systemTemplate/forestFire/Toolbar/Toolbar.vue b/src/views/systemTemplate/forestFire/Toolbar/Toolbar.vue index 6cd4d37..68c1f45 100644 --- a/src/views/systemTemplate/forestFire/Toolbar/Toolbar.vue +++ b/src/views/systemTemplate/forestFire/Toolbar/Toolbar.vue @@ -78,7 +78,7 @@ import SkyBoxOnGround from "@/components/CesiumMap/skyBoxOnGround"; // 属性弹窗相关 // import DialogPropertyGrid from './../DialogPropertyGrid'; // import { setPropertyData } from './../DialogPropertyGrid/property'; -// import FeatureGroundPrimitive from '@/components/CesiumMap/FeatureGroundPrimitive'; +import FeatureGroundPrimitive from '@/components/CesiumMap/FeatureGroundPrimitive'; // 工具栏图标 import baseDrawIcon from "@/assets/icons/toolbar_base_draw.png"; @@ -149,6 +149,23 @@ let bus = null let toolbarLayer = null let primitiveList = [] let params = {} +const whiteList = [ + 'location', + 'polyline', + 'polygon', + 'curvePolygon', + 'warning', + 'track', + 'ranger', + 'ptz', + 'bayonet', + 'airport', + 'hot', + 'watersource', + 'warehouse', + 'road', + 'keyarea', +] const isOpen = ref(false) const options = ref([ { @@ -421,6 +438,7 @@ watch(() => props.viewer, (v) => { viewer, toolbarLayer, primitiveList, + whiteList, } // 气象效果 @@ -459,13 +477,48 @@ watch(() => props.viewer, (v) => { // 清空 bus.on('toolbar_clear', toolbarClear); + // view 模式下，鼠标移动显示是否存在属性编辑要素 + bus.onScreen(Cesium.ScreenSpaceEventType.MOUSE_MOVE, checkFeatureEvent, ScreenMode.VIEW) // view 模式下，点击地图要素显示属性编辑弹窗 - bus.onScreen(Cesium.ScreenSpaceEventType.LEFT_CLICK, ({ position }) => { - pickFeatureProperty(position, params) - }, ScreenMode.VIEW) + bus.onScreen(Cesium.ScreenSpaceEventType.LEFT_CLICK, pickFeatureEvent, ScreenMode.VIEW) } }, { immediate: true }); +const checkFeatureEvent = (event) => { + const position = event.endPosition + const pickedEntityList = viewer.scene.drillPick(position) + let pickedFlag = false; + for (let index = 0; index < pickedEntityList.length; index++) { + const pickedEntity = pickedEntityList[index]; + console.log('拾取实体:', pickedEntity) + if (Cesium.defined(pickedEntity) && Cesium.defined(pickedEntity.id) && pickedEntity.id instanceof Cesium.Entity) { + const entity = pickedEntity.id; + const type = entity?.properties?.getValue()?.__type + if (type && whiteList.includes(type)) { + pickedFlag = true; + break; + } + } else if (Cesium.defined(pickedEntity) && Cesium.defined(pickedEntity.primitive) && pickedEntity.primitive instanceof FeatureGroundPrimitive) { + const primitive = pickedEntity.primitive; + const type = primitive.properties?.getValue()?.__type + if (type && whiteList.includes(type)) { + pickedFlag = true; + break; + } + } + } + viewer.container.style.cursor = pickedFlag ? 'pointer' : 'default'; +} + +const pickFeatureEvent = ({ position }) => { + pickFeatureProperty(position, params) +} + +onUnmounted(() => { + bus.offScreen(Cesium.ScreenSpaceEventType.MOUSE_MOVE, checkFeatureEvent, ScreenMode.VIEW) + bus.offScreen(Cesium.ScreenSpaceEventType.LEFT_CLICK, pickFeatureEvent, ScreenMode.VIEW) +}) +