地图：人员定位/历史轨迹，人员定位标点增加label

src/views/map/index.vue

@@ -217,6 +217,18 @@
             </template>
           </template>
         </template>
+        <transition
+          enter-active-class="animate__animated animate__fadeInDown"
+          leave-active-class="animate__animated animate__fadeOutUp"
+        >
+        <div class="people_trajectory" v-if="isPeopleTrajectory">
+          <el-select v-model="peopleTrajectoryValue" popper-class="people_trajectory_select">
+            <el-option v-for="item in onePerLocArr" :key="item.id" :value="item.id" :label="item.id"/>
+          </el-select>
+          <el-button class="search_btn" @click="addTrajectory">搜索</el-button>
+          <el-button class="reset_btn" @click="()=>{removeTrajectory();peopleTrajectoryValue = ''}">重置</el-button>
+        </div>
+        </transition>
       </div>
     </transition>
     <div class="right_options">
@@ -1175,7 +1187,9 @@ export default {
         linkPort: '8093',
         VIIDPort: '8088'
       },
-      trajectoryEntityCollection: {}
+      trajectoryEntityCollection: {},
+      isPeopleTrajectory:false,
+      peopleTrajectoryValue:''
     }
   },
   mounted() {
@@ -1474,35 +1488,36 @@ export default {
         // var cartesian = this.getCatesian3FromPX(movement.position)
       }, Cesium.ScreenSpaceEventType.LEFT_CLICK)
       viewer.cesiumWidget.screenSpaceEventHandler.removeInputAction(Cesium.ScreenSpaceEventType.RIGHT_DOUBLE_CLICK)
-      viewer.cesiumWidget.screenSpaceEventHandler.removeInputAction(Cesium.ScreenSpaceEventType.RIGHT_CLICK)
+      // viewer.cesiumWidget.screenSpaceEventHandler.removeInputAction(Cesium.ScreenSpaceEventType.RIGHT_CLICK)
       document.addEventListener('contextmenu', function(event) {
         event.preventDefault()
       })
-      this.handler.setInputAction(movement => {
+    //   this.handler.setInputAction(movement => {
-        const pick = viewer.scene.pick(movement.position)
+    //     const pick = viewer.scene.pick(movement.position)
-        if (Cesium.defined(pick) && (pick.id.id)) {
+    //     if (Cesium.defined(pick) && (pick.id.id)) {
-          if (!pick.id._monitoItems) {
+    //       if (!pick.id._monitoItems) {
-            this.removeTrajectory()
+    //         this.removeTrajectory()
-            return
+    //         return
-          }
+    //       }
-          const point_type = pick.id._monitoItems.data.point_type
+    //       const point_type = pick.id._monitoItems.data.point_type
-          const point_id = pick.id._monitoItems.data.id
+    //       const point_id = pick.id._monitoItems.data.id
-          const corpInfoId = pick.id._monitoItems.data.corpInfoId
+    //       const corpInfoId = pick.id._monitoItems.data.corpInfoId
-          if (point_type === '标记点peoplePositionOne') {
+    //       if (point_type === '标记点peoplePositionOne') {
-            this.removeTrajectory()
+    //         this.removeTrajectory()
-            this.addTrajectory(point_id, corpInfoId)
+    //         this.addTrajectory(point_id, corpInfoId)
-          }
+    //       }
-        } else {
+    //     } else {
-          this.removeTrajectory()
+    //       this.removeTrajectory()
-        }
+    //     }
-      }, Cesium.ScreenSpaceEventType.RIGHT_CLICK)
+    //   }, Cesium.ScreenSpaceEventType.RIGHT_CLICK)
     },
-    addTrajectory(point_id, corpInfoId) {
+    addTrajectory() {
+      this.removeTrajectory()
       requestFN(
         '/map/getPersonTrace',
         {
-          id: point_id,
+          id: this.peopleTrajectoryValue,
-          corpId: corpInfoId
+          corpId: this.CORP_INFO_ID
         }
       ).then((data) => {
         if (data.list) {
@@ -1964,6 +1979,7 @@ export default {
             this.bottomOptionsList[i].list[j].check = false
           }
         }
+        this.isPeopleTrajectory = false
       }
     },
     clearAllBottomOptionsItemsEntityCollection() {
@@ -2078,10 +2094,22 @@ export default {
           }
           this.carLocArr = []
         }
+        if(urlType === 'peopleTrajectory'){
+          this.isPeopleTrajectory = false
+        }
         if (this.gangkouActive === '00003' && this.CORP_INFO_ID === '035958e685cf4850bc40151c5e0617a6' && urlType === 'peoplePosition') {
           this.doUnSubscribe()
           this.clearMqttPoint('+/UwbBQ/')
           this.removeTrajectory()
+          for (let i = 0; i < this.bottomOptionsList[pindex].list.length; i++) {
+            if(this.bottomOptionsList[pindex].list[i].type === 'peopleTrajectory'){
+              if(this.bottomOptionsList[pindex].list[i].check){
+                this.bottomOptionsList[pindex].list[i].check = false
+                this.isPeopleTrajectory = false
+                break
+              }
+            }
+          }
         }
         if (this.gangkouActive === '00003' && this.CORP_INFO_ID === '21590a00ea5e462e9ee44dd332dddc26' && urlType === 'peoplePosition') {
           this.clearRYDWPoint('+/UwbBQ/')
@@ -2099,6 +2127,23 @@ export default {
           }
         })
       } else {
+        if(urlType === 'peopleTrajectory'){
+          let flag = false
+          for (let i = 0; i < this.bottomOptionsList[pindex].list.length; i++) {
+            if(this.bottomOptionsList[pindex].list[i].type === 'peoplePosition'){
+              if(!this.bottomOptionsList[pindex].list[i].check){
+                flag = true
+                break
+              }
+            }
+          }
+          if(flag){
+            this.$message.warning('请先选择人员定位！！！')
+            return
+          }else{
+            this.isPeopleTrajectory = true
+          }
+        }
         // 选中
         this.bottomOptionsList[pindex].list[index].check = true
         if (this.gangkouActive === '00004') {
@@ -3614,9 +3659,51 @@ export default {
     transform: translateY(0);
   }
 }
+  .people_trajectory{
+    position: absolute;
+    top: -60px;
+    left: 0;
+    width: 400px;
+    padding: 10px;
+    background-image: linear-gradient(to right, rgb(31 62 129 / 57%) 0%, rgb(17 93 255 / 40%) 50%, rgb(31 62 129 / 57%) 100%);
+    .search_btn{
+      background-color: #1563e3;
+      color: #fff;
+      border-color: #1563e3;
+    }
+    .reset_btn{
+      background-color: #558be5;
+      color: #fff;
+      border-color: #558be5;
+    }
+  }
 </style>
 <style>
 .cesium-viewer-toolbar, .cesium-viewer-fullscreenContainer, .cesium-infoBox-visible {
   display: none !important;
+}
+  .people_trajectory .el-input__inner{
+    background-color: #100693 !important;
+    border-color: #100693 !important;
+    color: #fff !important;
+  }
+  .people_trajectory_select{
+    background-color: #100693 !important;
+    border-color: #100693 !important;
+  }
+.people_trajectory_select .el-select-dropdown__item, .el-select-dropdown__item{
+  color: #fff !important;
+}
+.people_trajectory_select .el-select-dropdown__item.hover, .el-select-dropdown__item:hover{
+  background-color: #2111ec !important;
+  color: #fff !important;
+}
+.people_trajectory_select .popper__arrow{
+  border-top-color: #100693 !important;
+  border-bottom-color: #100693 !important;
+}
+.people_trajectory_select .popper__arrow::after{
+  border-top-color: #100693 !important;
+  border-bottom-color: #100693 !important;
 }
 </style>

src/views/map/js/ry_dragentity.js

@@ -30,6 +30,16 @@ export default class DragEntity {
         heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
         disableDepthTestDistance: Number.POSITIVE_INFINITY
       },
+      label: {
+        text: point.id,
+        font: '13px sans-serif',
+        pixelOffset: new Cesium.Cartesian2(0, -55),
+        showBackground: true,
+        // eslint-disable-next-line new-cap
+        backgroundColor: new Cesium.Color.fromCssColorString('rgba(20, 58, 142, 1)'),
+        backgroundPadding: new Cesium.Cartesian2(7, 5),
+        disableDepthTestDistance: Number.POSITIVE_INFINITY
+      },
       orientation: new Cesium.VelocityOrientationProperty(point.property),
 
       monitoItems: {