监控中心摄像头范围

src/components/supermap-2.5d.vue

@@ -30,6 +30,8 @@ export default {
       markerboxEntity: [],//地图落点实体
       connectBoxEntity: null,//地图线实体
       graphicsBoxEntity: null,//地图面实体
+      markerboxEntityRadius: [],//地图落点实体
+      connectBoxEntityTwo: null,//地图线实体
       /*************************原地图属性*********************/
       isEditableLayers: false, //绘图控件
 
@@ -51,6 +53,78 @@ export default {
   props: {},
   methods: {
     //移除之前添加的点
+    clearMRadius() {
+      this.viewer.entities.removeAll()
+      if (this.markerboxEntityRadius != null) {
+        this.viewer.entities.remove(this.markerboxEntityRadius)
+        this.markerboxEntityRadius = []
+      }
+    },
+    //移除之前添加的线
+    clearTwoC() {
+      // 查找ID为entityE的图形对象
+      this.viewer.entities.remove(this.connectBoxEntityTwo)
+    },
+    /**
+     * 地图落点-覆盖范围
+     */
+    setMarkersRadius(makerList) {
+      let that = this
+      that.handler = new Cesium.ScreenSpaceEventHandler(this.viewer.scene.canvas)
+      clearInterval(that.aac)
+      for (let i in makerList) {
+        let longitude = makerList[i].lng;
+        let latitude = makerList[i].lat;
+        let marker = that.viewer.entities.add({
+          name:"",
+          position: Cesium.Cartesian3.fromDegrees(longitude, latitude),
+          billboard: {
+            image: iconList[makerList[i].icon],
+            width: 48,
+            height: 48,
+            heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
+            disableDepthTestDistance:Number.POSITIVE_INFINITY
+          },
+          description: makerList[i].bindPopupHtml,
+          click: makerList[i].click,
+          parameter: makerList[i].parameter
+        })
+        that.markerboxEntityRadius.push(marker)
+        //绘制摄像头的圈（覆盖范围）
+        that.viewer.entities.add({
+          position: Cesium.Cartesian3.fromDegrees(makerList[i].lng,makerList[i].lat,2),
+          ellipse: {
+            semiMinorAxis: makerList[i].radius,
+            semiMajorAxis: makerList[i].radius,
+            material: Cesium.Color.AQUA.withAlpha(0.5),
+            outline: true,
+            outlineColor: Cesium.Color.AQUA.withAlpha(0.5),
+            outlineWidth: 12,
+          },
+        });
+      }
+      that.viewer.scene.globe.depthTestAgainstTerrain = false
+      that.createLeftClickDescription()
+      that.createRightClickDescription()
+    },
+    /**
+     * 地图画线(贴地)
+     */
+    setConnectTwoList(connectList,color,withAlpha) {
+      let that = this
+      //Cesium.Color.fromCssColorString('#67ADDF')   16进制颜色设置
+      let material = Cesium.Color.fromCssColorString(color).withAlpha(withAlpha);
+      that.connectBoxEntityTwo = that.viewer.entities.add({
+        Type: 'Polyline',
+        polyline: {
+          positions: Cesium.Cartesian3.fromDegreesArray(connectList),
+          clampToGround: true,//贴地 true,不贴地  false
+          width: 5,
+          material: material
+        }
+      })
+    },
+    //移除之前添加的点
     clearM() {
       this.viewer.entities.removeAll()
       if (this.markerboxEntity != null) {

src/views/monitor.vue

@@ -659,9 +659,13 @@ export default {
             // longitude: "125.3333"
           }
           setTimeout(() => {
-            that.$refs.supermap.clearM()
-            that.$refs.supermap.setMarkers(this.cameraMarkersList)
+            that.$refs.supermap.clearMRadius()
+            that.$refs.supermap.setMarkersRadius(this.cameraMarkersList)
           }, 3000)
+        }else{
+          setTimeout(() => {
+            that.$refs.supermap.clearMRadius()
+          }, 1000)
         }
       })
     },
@@ -754,12 +758,12 @@ export default {
             // longitude: "125.3333"
           }
           setTimeout(() => {
-            that.$refs.supermap.clearM()
-            that.$refs.supermap.setMarkers(this.cameraMarkersList)
+            that.$refs.supermap.clearMRadius()
+            that.$refs.supermap.setMarkersRadius(this.cameraMarkersList)
           }, 3000)
         }else{
           setTimeout(() => {
-            that.$refs.supermap.clearM()
+            that.$refs.supermap.clearMRadius()
           }, 3000)
         }
       })