Merge branch 'master' of http://139.196.74.78:10010/r/drone/command-center-...

chenyao

2025-04-14 bb95bfaecd139e440d21bdcdd5fc578625a7b912

 src/views/TaskManage/TaskIntermediateContent/CurrentTaskDetails/RealTimeMap.vue

@@ -1,13 +1,7 @@


<template>
   <div id="currentTaskMap">


   </div>
   <div id="currentTaskMap"></div>
</template>
<script setup>

import * as Cesium from 'cesium'
import AmapMercatorTilingScheme from '@/utils/cesium/AmapMercatorTilingScheme'
import { Cartesian3, Terrain, Viewer } from 'cesium'
@@ -19,6 +13,7 @@
import ImageTrailMaterial from '@/utils/cesium/ImageTrailMaterial'
import lineImg from '@/assets/images/arrow-right-blue.png'
import { flyVisual } from '@/utils/cesium/mapUtil'
import CreateFrustum from '@/utils/cesium/frustum/CreateFrustum'

const imageryProvider_ammapSL = new Cesium.UrlTemplateImageryProvider({
   url: 'https://webrd02.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}',
@@ -32,6 +27,9 @@
   credit: 'amap_SL',
})
let viewer = null
const taskDetails = inject('taskDetails')
const deviceOsdInfo = inject('deviceOsdInfo')

const initMap = () => {
   viewer = new Viewer('currentTaskMap', {
      terrain: Terrain.fromWorldTerrain(),
@@ -51,17 +49,16 @@
   const options = {
      bInvertColor: true,
      bFilterColor: true,
      filterColor: '#4e70a6'
      filterColor: '#4e70a6',
   }
   // 添加蓝色滤镜
   addBlueFilter(options,viewer,gdLayer)
   addBlueFilter(options, viewer, gdLayer)
   viewer.scene.morphTo2D(0)
   //设置默认点
   viewer.camera.setView({
      destination: Cartesian3.fromDegrees(115.763819, 28.787374,5000),
      destination: Cartesian3.fromDegrees(115.763819, 28.787374, 5000),
   })
}


const drawWayline = lineObj => {
   const positions = lineObj.Placemark.map(item => {
@@ -79,7 +76,7 @@
   })
   // 终点
   viewer.entities.add({
      position: positions[positions.length-1],
      position: positions[positions.length - 1],
      billboard: {
         image: new Cesium.ConstantProperty(endPointImg),
         width: 30,
@@ -103,32 +100,55 @@
   })
}


// 解析kmz文件
const parsingFiles = async (url) => {
const parsingFiles = async url => {
   const res = await analyzeKmzFile(`${url}?_t=${new Date().getTime()}`)
   const waylinesXML = await res.fileInfoObj['wpmz/waylines.wpml']
   const waylinesXMLJSON = XMLToJSON(waylinesXML)?.['Document'];
   const waylinesXMLJSON = XMLToJSON(waylinesXML)?.['Document']
   const waylinesXMLObj = removeTextKey(waylinesXMLJSON.Folder)
   if (!waylinesXMLObj.Placemark.length) return;
   if (!waylinesXMLObj.Placemark.length) return
   const allPoint = waylinesXMLObj.Placemark.map(item => item.Point.coordinates.split(','))
   flyVisual(allPoint,viewer)
   flyVisual(allPoint, viewer)
   drawWayline(waylinesXMLObj)
};
}

const removeMap = () => {
   viewer.entities.removeAll()
   viewer.destroy()
}

const taskDetails = inject('taskDetails')
let viewInfoFrustum
// 设置视椎
const setCreateFrustum = () => {
   const deviceInfo = deviceOsdInfo.value?.data?.host
   if (!deviceInfo) return
   viewInfoFrustum?.clear()
   if ([14, 0].includes(deviceInfo.mode_code)) return
   const attitude_head = 180 + deviceInfo.attitude_head
   const gimbal_pitch = 90 - Number(deviceInfo?.payloads[0]?.gimbal_pitch) || 0
   viewInfoFrustum = new CreateFrustum(viewer, {
      position: {
         longitude: deviceInfo.longitude,
         latitude: deviceInfo.latitude,
         altitude: deviceInfo.height,
      },
      width: 30,
      height: 30,
      fov: 20.0,
      near: 3.0,
      far: 250.0,
      roll: gimbal_pitch,
      pitch: 0,
      heading: attitude_head,
   })
}

watch(deviceOsdInfo, setCreateFrustum)
watch(taskDetails, () => {
   if (taskDetails.value.way_lines.length){
   if (taskDetails.value.way_lines.length) {
      parsingFiles(taskDetails.value.way_lines[0].url)
   }
})

onBeforeUnmount(() => {
   removeMap()
})
@@ -138,13 +158,13 @@
      initMap()
   })
})

</script>
<style scoped lang="scss">
#currentTaskMap {
   width: 50%;
   padding-left: 10px;
   height: 100%;

   :deep() {
      .cesium-viewer {
         width: 100%;