Ver código fonte

巡查任务画线 监控中心摄像头范围

JX.LI 2 anos atrás
pai
commit
52c37fce3a
3 arquivos alterados com 943 adições e 862 exclusões
  1. 74 0
      src/components/supermap-2.5d.vue
  2. 13 9
      src/views/leader.vue
  3. 856 853
      src/views/monitor.vue

+ 74 - 0
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) {

+ 13 - 9
src/views/leader.vue

@@ -390,9 +390,16 @@ export default {
     },
     // 巡查任务落点
     drawTaskPoint(patrolTrajectory) {
+        let list = JSON.parse(patrolTrajectory)
+        let data = []
+        for (var i = 0; i < list.length; i++) {
+          data.push(list[i].lng);
+          data.push(list[i].lat);
+        }
       setTimeout(() => {
         this.$refs.supermap.clearC();
-        this.$refs.supermap.setConnectList(JSON.parse(patrolTrajectory), '#04f');
+          this.$refs.supermap.clearTwoC();
+        this.$refs.supermap.setConnectList(data, '#04f',0.8);
       }, 1000)
     },
     //点击巡查轨迹时段 巡查轨迹落点
@@ -402,18 +409,15 @@ export default {
       console.log("落点", res.data)
       if (res.data != null && res.data.length > 0) {
         for (let i = 0; i < res.data.length; i++) {
-          let latlng = {
-            lat: res.data[i].latitude,
-            lng: res.data[i].longitude
-          }
-          this.connectList.push(latlng)
+						that.connectList.push(res.data[i].longitude)
+						that.connectList.push(res.data[i].latitude)
         }
         setTimeout(() => {
-          that.$refs.supermap.clearCTwo()
-          that.$refs.supermap.setConnectTwoList(this.connectList, '#f40')
+          that.$refs.supermap.clearTwoC()
+          that.$refs.supermap.setConnectTwoList(this.connectList, '#f40',0.8)
         }, 1000)
       } else {
-        that.$refs.supermap.clearCTwo()
+        that.$refs.supermap.clearTwoC()
       }
     },
     setConnectList(points, planName) {

Diferenças do arquivo suprimidas por serem muito extensas
+ 856 - 853
src/views/monitor.vue