1.基础绘制中的位置点、折线、多边形、曲面，添加经纬度、长度、面积等属性；2.添加白名单，类型在其中的地图要素才能被选择；鼠标移动到可选地图要素时图标变化；3.优化代码；

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)}平方米`,

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)}米`,

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,

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)
+})
+
 </script>
 
 <style lang="scss" scoped>

src/views/systemTemplate/forestFire/Toolbar/baseDraw.js

@@ -6,6 +6,7 @@ import {
   createAttackArrowPositions,
   createDoubleArrowPositions
 } from '@/components/CesiumMap/mixins/useDrawTool';
+import { getDistance, getArea } from '@/components/CesiumMap/mixins/useMeasureTool';
 import drawLocationIcon from '@/assets/icons/draw_location.png';
 
 // 绘制位置
@@ -19,13 +20,21 @@ const drawLocation = (options) => {
   drawTool.abort();
   measureTool.abort();
   drawTool.drawPoint().then(position => {
+    // 计算中心点坐标
+    const center = Cesium.Cartographic.fromCartesian(position);
+
     toolbarLayer?.entities.add({
       position,
       billboard: {
         image: drawLocationIcon,
         verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
         heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
-      }
+      },
+      properties: {
+        __type: 'location',
+        longitude: Cesium.Math.toDegrees(center.longitude).toFixed(6),
+        latitude: Cesium.Math.toDegrees(center.latitude).toFixed(6),
+      },
     });
   });
 };
@@ -47,6 +56,10 @@ const drawPolyline = (options) => {
         material: Cesium.Color.YELLOW,
         clampToGround: true,
       },
+      properties: {
+        __type: 'polyline',
+        length: getDistance(positions).toFixed(2),
+      },
     })
   });
 };
@@ -73,6 +86,10 @@ const drawPolygon = (options) => {
         material: Cesium.Color.YELLOW.withAlpha(0.5),
         heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
       },
+      properties: {
+        __type: 'polygon',
+        area: getArea(positions).toFixed(2),
+      },
     });
   });
 };
@@ -102,6 +119,10 @@ const drawCurvePolygon = (options) => {
         material: Cesium.Color.YELLOW.withAlpha(0.5),
         heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
       },
+      properties: {
+        __type: 'curvePolygon',
+        area: getArea(createCurvePolygonPositions(positions)).toFixed(2),
+      },
     });
   });
 };

src/views/systemTemplate/forestFire/Toolbar/forestFireDraw.js

@@ -108,6 +108,10 @@ const pickFeatureProperty = (position, params) => {
         if(obj.id.name?.indexOf('__') === 0) {
           continue
         }
+        // 白名单之外的不识别
+        if(!params.whiteList.includes(obj.id?.properties?.getValue()?.__type)) {
+          continue
+        }
         // getPropertyData(obj.id);
         DialogPropertyGrid.show(obj.id, (data) => {
           // 更新实体属性