src/assets/js/cesium-map/measureDistance.js

@@ -119,23 +119,6 @@ export default class MeasureDistance {
         this.viewer.scene.requestRender()
     }
 
-    addPointEntity(position){
-        let pEntity = this.viewer.entities.add({
-            position: position,
-            type: "routeDetectPoint",
-            point: {
-                show: true,
-                pixelSize: 10,
-                color: Cesium.Color.ORANGERED,
-                outlineColor: Cesium.Color.WHITE,
-                outlineWidth: 2,
-                clampToGround: true,
-                heightReference:Cesium.HeightReference.CLAMP_TO_GROUND,
-                disableDepthTestDistance:99000000,
-            },
-        });
-        this.vertexEntities.push(pEntity)
-    }
     addKml(kml_file){
         let kmlDataPromise = Cesium.KmlDataSource.load(kml_file, {
             camera: this.viewer.scene.camera,
@@ -315,7 +298,7 @@ export default class MeasureDistance {
     }
 
     /**
-     * 显示航线
+     * 显示飞行航线
      * @param line Airline
      */
     showAirLine(line){
@@ -324,34 +307,17 @@ export default class MeasureDistance {
             let coord = new Cartesian3.fromDegrees(line.points[i].lon,line.points[i].lat,line.points[i].alt)
             degreesArr.push(coord)
         }
-        if(line.isClose)
-            degreesArr.push(new Cartesian3.fromDegrees(line.points[0].lon,line.points[0].lat,line.points[0].alt))
-
         let airlineEntity = new Cesium.Entity({
             name: line.name,
-            id: line.name + line.totalDistance,
+            id: line.name+line.totalDistance,
             polyline: {
                 positions: degreesArr,
-                width: 3,
+                width: 2,
                 material: Cesium.Color.ORANGE,
-                clampToGround: false,
-            }
+                clampToGround: true,
+            },
         })
         this.viewer.entities.add(airlineEntity)
-        for (let pt in degreesArr) {
-            let vertexEntity = new Cesium.Entity({
-                // id: "航点" + ,
-                position:  pt,
-                point: {
-                    color: Cesium.Color.FUCHSIA,
-                    pixelSize: 6,
-                    disableDepthTestDistance:99000000,
-                    // heightReference:Cesium.HeightReference.CLAMP_TO_GROUND,
-                }
-            });
-            this.viewer.entities.add(vertexEntity)
-        }
-
     }
 
     addAirplaneEntity(modelPath,StrUavTypeID){
@@ -368,7 +334,7 @@ export default class MeasureDistance {
                 return new Cesium.Transforms.headingPitchRollQuaternion(
                     new Cesium.Cartesian3.fromDegrees(this.dynamicData.lon, this.dynamicData.lat, this.dynamicData.alt),
                     new Cesium.HeadingPitchRoll(
-                        Cesium.Math.toRadians(this.dynamicData.heading-0),    // 0：调整该值（不同模型的正方向不同）
+                        Cesium.Math.toRadians(this.dynamicData.heading-90),    // 0是正东，顺时针增加
                         Cesium.Math.toRadians(0),
                         Cesium.Math.toRadians(0)
                     ))
@@ -376,9 +342,8 @@ export default class MeasureDistance {
 
             model: {
                 uri: modelPath,
-                scale: 0.001,
                 minimumPixelSize: 100,
-                maximumScale: 1,
+                maximumScale: 2000,
                 runAnimations: true,
                 clampAnimations: true,
                 color: Cesium.Color.fromAlpha(Cesium.Color.RED, parseFloat(1.0)),
@@ -394,7 +359,6 @@ export default class MeasureDistance {
         window.viewer.trackedEntity = null;
         window.viewer.camera.lookAtTransform(Cesium.Matrix4.IDENTITY);
     }
-
     stopAreaMeasure(){
         if (!this.measAreaStatus) return;
         this.handler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK);

src/assets/js/websocketProtocol.ts

@@ -8,7 +8,7 @@ import {useLayerStore} from "@/store/layerManagerStore.ts";
  */
 function dataProcess(websocketDataCC:any): UavDynamicInfo|null {
     let data:UavDynamicInfo = {
-        alt: 0, groundSpeed: 0, heading: 0, pitch: 0,lat: 0, lon: 0, uavId: "", uavType: ""
+        alt: 0, groundSpeed: 0, heading: 0, lat: 0, lon: 0, uavId: "", uavType: ""
     }
     if(websocketDataCC.infoType===1) {
         let aUavInfo:any = websocketDataCC.info[0]  //目前只取第一个uav
@@ -37,17 +37,15 @@ function dataProcess(websocketDataCC:any): UavDynamicInfo|null {
  * @return UavDynamicInfo
  */
 function dataProcess_fromQT(websocketDataQT:any): UavDynamicInfo|null {
-
     let data:UavDynamicInfo = {
-        alt: 0, groundSpeed: 0, heading: 0, pitch: 0, lat: 0, lon: 0, uavId: "", uavType: ""
+        alt: 0, groundSpeed: 0, heading: 0, lat: 0, lon: 0, uavId: "", uavType: ""
     }
     data.uavId = websocketDataQT.pos.uavId
     data.uavType = websocketDataQT.pos.uavType
     data.heading = websocketDataQT.pos.HeadAngle
-    data.pitch = websocketDataQT.pos.FyAngle
     data.lon = websocketDataQT.pos.lon
     data.lat = websocketDataQT.pos.lat
-    data.alt = Number(websocketDataQT.pos.height) + useLayerStore().navi.hFactor
+    data.alt = websocketDataQT.pos.height
     data.groundSpeed = websocketDataQT.pos.groundSpeed   //km/h
 
     useLayerStore().navi.currentRouteID = websocketDataQT.navi.currentRouteID
@@ -55,8 +53,8 @@ function dataProcess_fromQT(websocketDataQT:any): UavDynamicInfo|null {
     useLayerStore().navi.nextPoint = websocketDataQT.navi.nextPoint
     useLayerStore().navi.distonext = websocketDataQT.navi.distonext
 
-    // console.log(data.lon,data.lat, data.alt)
-    //
+    console.log(data.lon,data.lat, data.alt)
+
     return data.lon==0? null: data
 }
 
@@ -65,23 +63,24 @@ function dataProcess_fromQT_route(websocketDataQT:any): Airline|null {
         code: 0, PtNum: 0, isClose: false, name: "", points: [], totalDistance: 0
     }
     if(!websocketDataQT.route)  return null
-    data.PtNum = websocketDataQT.route.points.length
-    data.isClose = websocketDataQT.route.isClose
-    for (let i = 1; i < websocketDataQT.route.points.length; i++) {
+    data.PtNum = websocketDataQT.route.length
+    for (let i = 1; i < websocketDataQT.route.length; i++) {
         let aPt: AirlinePoint = {alt: 0, ch1: 0, ch2: 0, lat: 0, lon: 0, nPt: 0, speed: 0}
-        aPt.lon = websocketDataQT.route.points[i].lon
-        aPt.lat = websocketDataQT.route.points[i].lat
-        aPt.alt = websocketDataQT.route.points[i].height
-        aPt.ch1 = websocketDataQT.route.points[i].ch1
-        aPt.ch2 = websocketDataQT.route.points[i].ch2
-        aPt.nPt = websocketDataQT.route.points[i].nPt
-        aPt.speed = websocketDataQT.route.points[i].nV
-        data.code = websocketDataQT.route.points[i].nL
+        aPt.lon = websocketDataQT.route[i].lon
+        aPt.lat = websocketDataQT.route[i].lat
+        aPt.alt = websocketDataQT.route[i].height
+        aPt.ch1 = websocketDataQT.route[i].ch1
+        aPt.ch2 = websocketDataQT.route[i].ch2
+        aPt.nPt = websocketDataQT.route[i].nPt
+        aPt.speed = websocketDataQT.route[i].nV
+        data.code = websocketDataQT.route[i].nL
         data.points.push(aPt)
     }
+    if(data.points[data.PtNum-2].ch1 ==2)
+        data.isClose = true
+
     data.name = "lineID-" + data.code.toString()
     console.log(data)
-
     return data.PtNum==0? null: data
 }
 

src/components/CollisionDetection.vue

@@ -1,82 +1,50 @@
 <script setup lang="ts">
 import {
   drawEcharts_CollisionDetection,
-  drawEcharts_CollisionDetection2,
   profileAnalyse
 } from "@/utils/map/SpatialAnalysis.ts";
 import {Cartesian3} from "cesium";
-import {defineEmits, onMounted} from "vue";
+import {nextTick, onMounted} from "vue";
 import * as echarts from "echarts";
 import {EChartsType} from "echarts";
-import {useLayerStore} from "@/store/layerManagerStore.ts";
-let l_store = useLayerStore()
+
 let myChart: EChartsType = undefined
-let myChart1: EChartsType = undefined
-let uavDisArr: number[] = []
-let uavHeightArr: number[] = []
-let terrainArr: number[] = []
-defineEmits(['shutdown']);
+
 onMounted(()=>{
   myChart = echarts.init(document.getElementById('detection-chart'))
-  myChart1 = echarts.init(document.getElementById('terrain-chart'))
-})
-window.addEventListener('resize',function(){
-  myChart.resize()
-  myChart1.resize()
+  // nextTick(()=>{
+  //
+  // })
 })
-const props = defineProps(['groundHeight'])
 /**
- * 绘制地形碰撞检测折线图，差值间隔为1km
+ * 绘制地形碰撞检测折线图
  * @param height 飞机高度，作为检测线
  * @param currentPos 当前飞机经纬度，作为原点
  * @param nextPos 下一航点经纬度，作为目标点
- * @param max_dis 预先探测距离 m
  */
-const drawTerrain = (height: number, currentPos:Cartesian3, nextPos: Cartesian3, max_dis: number) => {
-  // 计算地形剖面，默认采样间隔为1km
-  let res = profileAnalyse(window.viewer, [currentPos, nextPos],1000)
+const drawDetection = (height: number, currentPos:Cartesian3, nextPos: Cartesian3) => {
+  // 计算地形剖面
+  let res = profileAnalyse(window.viewer, [currentPos, nextPos], 10)
   // 弹出图表窗口
-  drawEcharts_CollisionDetection(myChart1, res.distanceArray, res.elevationArray, height, max_dis)
-}
-
-/**
- * 绘制地形碰撞检测折线图
- * @param uavH 飞机高度
- * @param uavDis 飞机当前位置与上一位置的距离 米
- * @param terrainH 飞机当前地面投影点的地形高度
- */
-const drawDetection = (uavH: number, uavDis:number, terrainH: number) => {
-  if(uavDisArr.length == 0){
-    uavDisArr.push(Math.round(uavDis))
-  }
-  else{
-    uavDisArr.push(Math.round(uavDis + uavDisArr[uavDisArr.length - 1]))
-  }
-
-  uavHeightArr.push(Math.round(uavH))
-  terrainArr.push(Math.round(terrainH))
-
-  // 更新ECharts图表
-  drawEcharts_CollisionDetection2(myChart, uavDisArr, terrainArr, uavHeightArr)
-
+  nextTick(()=>{
+    drawEcharts_CollisionDetection(myChart, res.distanceArray, res.elevationArray, height)
+  })
 }
 
 defineExpose({
   drawDetection,
-  drawTerrain,
 })
 
 </script>
 
 <template>
-  <div class="chart" id="detection-chart"></div>
-  <div class="chart" id="terrain-chart"></div>
+<div id="detection-chart"></div>
 </template>
 
 <style scoped>
-.chart{
-  height: 25vh;
-  width: 33rem;
-  margin: 0 0 0 0;
+#detection-chart{
+  width: 50rem;
+  height: 15rem;
+  position: relative;
 }
 </style>

src/components/HomePage.vue

@@ -3,59 +3,33 @@ import {defineComponent} from 'vue'
 import SceneViewer from "@/components/map/SceneViewer.vue";
 import BottomBar from "@/components/map/BottomBar.vue";
 import Toolbar from "@/components/toolbar.vue";
-import CollisionDetection from "@/components/CollisionDetection.vue";
-import {useMessage} from 'naive-ui'
 
 export default defineComponent({
   name: "HomePage",
-  components: {CollisionDetection, Toolbar, BottomBar, SceneViewer},
-  data(){
-    return {
-      showDetection: false,
-      graphHeight: 0,
-      message: useMessage()
-    }
-  },
-  computed: {
-    setPageStyle: function () {
-      return this.showDetection? 100 - this.graphHeight : 100
-      }
-  },
-  methods: {
-    // 显示地形碰撞检测面板，resize地图窗口
-    resizeMap(height: number) {
-      if(height<0)
-        this.showDetection = false
-      else{
-        this.graphHeight = height
-        this.showDetection = true
-      }
-    },
-  }
+  components: {Toolbar, BottomBar, SceneViewer}
 })
 </script>
 
 <template>
-  <div id="map" :style="{height: setPageStyle+'vh'}">
+  <div id="map">
     <SceneViewer id="scene-viewer"></SceneViewer>
     <BottomBar></BottomBar>
-    <toolbar ref="ToolBar" @resizeMap="resizeMap"></toolbar>
+    <toolbar></toolbar>
   </div>
-
 </template>
 
 <style>
 @import '../styles/cesium-compass.css';
 #map {
   width: 100vw;
+  height: 100vh;
   position: relative;
+  /* overflow: hidden; */
 }
 #scene-viewer {
   width: 100vw;
-  height: 100%;
+  height: 100vh;
   position: absolute;
   overflow: hidden;
 }
-
-
 </style>

src/components/map/SceneViewer.vue

@@ -21,7 +21,7 @@ import {
 } from '@/utils/map/TDTProvider'
 import { initViewer, perfViewer, showNavigator } from '@/utils/map/sceneViewer'
 import { flyToChina } from '@/utils/map/camera'
-import MeasureDistance from "@/assets/js/measureDistance.js";
+import MeasureDistance from "@/assets/js/cesium-map/measureDistance";
 
 const viewerDivRef = ref<HTMLDivElement>()
 let viewer: Viewer

src/components/toolbar.vue

@@ -4,38 +4,35 @@
   创建人：Zhaipeixiu
 -->
 <script setup>
-import {ChevronBack,ChevronForward, CreateOutline, DuplicateSharp, EyeSharp, Layers, Settings} from '@vicons/ionicons5'
+import {ChevronBack, CreateOutline, DuplicateSharp, EyeSharp, Layers, Settings} from '@vicons/ionicons5'
 import {RulerAlt} from '@vicons/carbon'
 import {TerrainSharp} from '@vicons/material'
 import {DrawPolygon} from '@vicons/fa'
 import {useMessage} from 'naive-ui'
-import {ref, defineEmits} from "vue";
+import {nextTick, ref} from "vue";
 import {useStaticStore} from "@/store/staticOptions.js";
 import {dataProcess_fromQT, dataProcess_fromQT_route} from "@/assets/js/websocketProtocol.ts";
 import SpatialAnalysis from "@/components/SpatialAnalysis.vue";
 import LayerManager from "@/components/map/LayerManager.vue";
-import CollisionDetection from "./CollisionDetection.vue"
+import CollisionDetection from "@/components/CollisionDetection.vue";
 import {useLayerStore} from "@/store/layerManagerStore.ts";
 import {Cartesian3} from "cesium";
-import {ByDirectionAndLen, getDistance, getElevation} from "@/utils/map/geocomputation.ts";
+import * as echarts from "echarts";
 
-
-const emit = defineEmits(['resizeMap'])
 const message = useMessage();
 let SceneValue;
 let showModal = ref(false);
-let hasPlane = ref(false);
 let showDetection = ref(false);
+let hasPlane = ref(false);
 let store = useStaticStore();
 let lStore = useLayerStore();
-let groundHeight = ref(-1)
-let detectDivHeight = ref(25)
+
 const spatialAnalyse = ref(null)
 const layerManager = ref(null)
 const collisionDetection = ref(null)
 SceneValue = ref('untrace');
 let frameCount = 0
-let lastPos = undefined;  //飞机上一时点的坐标
+
 function handleSceneSelect(key){
   if(!hasPlane.value)   return;
 
@@ -47,19 +44,9 @@ function handleSceneSelect(key){
 }
 let layerValue = ref('layer1');
 let barIsOpen = ref(true);
-function openCloseBar() {
-  // 获取元素
-  let toolbar = document.querySelector('.panel-toolbar989834y34');
-  if(toolbar?.classList.contains('open')){  //关闭
-    toolbar?.classList.remove('open');
-  }
-  else {         // 打开
-    toolbar?.classList.add('open');
-  }
-  barIsOpen.value = !barIsOpen.value
-}
+
 function handleEditSelect(key) {
-  if(key === 'createLine') {
+  if(key === 'requestLine') {
 
   }
   else{
@@ -165,7 +152,7 @@ function measureArea() {
 async function connectWebSocket() {
   store.webskt.ws = new WebSocket('ws://'+store.webskt.ws_config.address+':'+store.webskt.ws_config.port);
   store.webskt.ws.onopen = function(event){
-    console.log("Connection open ...")
+    console.log("Connection open ...");
     store.webskt.ws.send("hello QT!")
   }
 
@@ -179,72 +166,49 @@ async function connectWebSocket() {
       if (ycData != null) {
         // 更新遥测数据（飞机位置）
         window.measureViewer.updateDynamicData(ycData)
-        lStore.validYCData = true
         // 添加飞机三维图标
         if(!hasPlane.value){
-          window.measureViewer.addAirplaneEntity(store.models.fp98, ycData.uavId + ycData.uavType)
+          window.measureViewer.addAirplaneEntity(store.models.defaultAirPlane, ycData.uavId + ycData.uavType)
           SceneValue.value = 'fallow'
           hasPlane.value = true;
         }
-        // 加载和更新碰撞检测图(50帧更新一次)
-        if(frameCount>50 && lStore.openDetect){
-          emit('resizeMap', detectDivHeight.value)
-          showDetection.value = true
+        /************************测试代码（以下）******************/
+        // if(frameCount>50) {   //(50帧更新一次)
+        //   frameCount = 0
+        //   //TODO: 调用子组件函数、测试
+        //   let cartesianTarget = Cartesian3.fromDegrees(114.6, 37.8)
+        //   let cartesianCurr = Cartesian3.fromDegrees(ycData.lon, ycData.lat, ycData.alt)
+        //   collisionDetection.value?.drawDetection(ycData.alt, cartesianCurr, cartesianTarget)
+        // }
+
+        /************************测试代码（以上）******************/
+        // 加载和更新碰撞检测图(20帧更新一次)
+        if(lStore.navi.airlines.length>0 && frameCount>50){
           frameCount = 0
-          let currentPos = Cartesian3.fromDegrees(ycData.lon, ycData.lat,ycData.alt)
-          // 显示飞机当前位置的地表投影点海拔高度 和 飞机高度（折线图）
-          new Promise(resolve => {
-            // 计算对地高度 m
-            groundHeight.value = ycData.alt - getElevation(window.viewer, currentPos)
-            // 计算当前点与上一点的距离 米
-            if(lastPos===undefined){
-              lastPos = currentPos;
+          lStore.navi.airlines.forEach(airline => {
+            if(airline.code === lStore.navi.currentRouteID){
+              let targetPos = airline.points[lStore.navi.nextPoint]
+              //TODO: 调用子组件函数、测试
+              let cartesianTarget = Cartesian3.fromDegrees(targetPos.lon, targetPos.lat,targetPos.alt)
+              let cartesianCurr = Cartesian3.fromDegrees(ycData.lon, ycData.lat,ycData.alt)
+              collisionDetection.value?.drawDetection(ycData.alt, cartesianCurr, cartesianTarget)
+
             }
-            let dis = getDistance(currentPos, lastPos) * 1000
-            lastPos = currentPos
-            resolve(dis)
-          }).then(res=>{
-            collisionDetection.value.drawDetection(ycData.alt, res, ycData.alt-groundHeight.value)
-          })
-          // 当前飞机高度（折线图） 和飞机前方10公里处的地形高度（以飞机当前航向推算）
-          let max_dis = 5000
-          new Promise(resolve => {
-            // 计算前方5公里处的坐标点
-            let detectPos = ByDirectionAndLen(currentPos, ycData.heading, max_dis)
-            // 计算地形剖面
-            collisionDetection.value.drawTerrain(ycData.alt, currentPos, detectPos, max_dis)
-            resolve(detectPos)
           })
         }
       }
-      else{ //遥测解析错误或无数据
-        lStore.validYCData = false
-      }
     }
     if(sktData.type === 1){
       let routeData = dataProcess_fromQT_route(sktData)
+      lStore.navi.airlines.push(routeData)
+      console.log(routeData)
       if(routeData != null){
-        lStore.navi.airlines.push(routeData)
-        lStore.navi.currentRouteID = routeData.code
-        console.log(routeData)
         window.measureViewer.showAirLine(routeData)
       }
-
     }
   };
 }
 
-//关闭动态碰撞检测功能
-function shutDownDetec() {
-  if(lStore.openDetect){
-    emit('resizeMap', -1)
-  }else{
-    emit('resizeMap', detectDivHeight.value)
-  }
-  showDetection.value = !showDetection.value;
-  lStore.openDetect = !lStore.openDetect
-
-}
 /**
  * 关闭websocket连接
  */
@@ -261,7 +225,7 @@ function manageLayer(){
 </script>
 
 <template>
-  <n-space class="panel-toolbar989834y34">
+  <n-space id="panel">
     <n-row justify-content="space-between">
     <n-tooltip placement="bottom" trigger="hover" >
       <template #trigger>
@@ -292,7 +256,6 @@ function manageLayer(){
     </n-dropdown>
     <n-dropdown :options="store.menuOptions.EditOptions" @select="handleEditSelect">
     <n-button tertiary circle type="warning">
-    <!--航线绘制-->
       <template #icon>
         <n-icon><CreateOutline/></n-icon>
       </template>
@@ -324,32 +287,25 @@ function manageLayer(){
     </n-tooltip>
     <n-popselect v-model:value="SceneValue" :options="store.menuOptions.sceneOptions"
                  @update:value="handleSceneSelect" size="medium">
+<!--                 :disabled="!hasPlane" -->
+
       <n-button tertiary circle type="warning">
         <template #icon>
           <n-icon><EyeSharp/></n-icon>
         </template>
       </n-button>
     </n-popselect>
-    <n-button tertiary circle type="warning" @click="openCloseBar">
+    <n-button tertiary circle type="warning">
       <template #icon>
-        <n-icon v-if="barIsOpen"><ChevronBack/></n-icon>
-        <n-icon v-else><ChevronForward/></n-icon>
+<!--        ChevronBack,ChevronForward,-->
+        <n-icon><ChevronBack/></n-icon>
       </template>
     </n-button>
     </n-row>
   </n-space>
-  <n-button id="bt_switch" size="small" :type="showDetection? 'error': 'success'" v-if="lStore.validYCData"
-            @click="shutDownDetec" :style="{bottom:'0vh'}">
-    {{showDetection? '关闭图表': '显示图表'}}
-  </n-button>
-
-  <n-collapse-transition v-show="showDetection">
-    <n-flex id="detectionGraph" justify="center"
-            :style="{height: detectDivHeight +'vh'}">
-      <CollisionDetection ref="collisionDetection" ></CollisionDetection>
-    </n-flex>
-  </n-collapse-transition>
-
+  <n-space id="detectionGraph" v-show="showDetection">
+    <CollisionDetection ref="collisionDetection"></CollisionDetection>
+  </n-space>
 
   <n-modal v-model:show="showModal"
         style="width: 30%"
@@ -385,31 +341,21 @@ function manageLayer(){
   <LayerManager ref="layerManager"></LayerManager>
 </template>
 
-<style>
-.panel-toolbar989834y34{
+<style scoped>
+#panel{
   position: absolute;
   top: 10px;
   left: 2px;
   border-radius: 7px;
   background: rgba(21, 21, 21, 0.94);
-  transition: left 0.3s;
 }
 
-.panel-toolbar989834y34.open{
-  position: absolute;
-  left: -20rem;
-}
-
-#bt_switch{
-  position: absolute;
-  z-index: 2;
-}
 #detectionGraph{
   position: absolute;
-  bottom: -25vh;
-  width: 100vW;
+  bottom: 2rem;
+  width: 100rem;
+  height: 15rem;
   border-radius: 7px;
-  background: rgba(255, 255, 255, 0.8);
+  background: rgba(21, 21, 21, 0.94);
 }
-
 </style>

src/store/layerManagerStore.ts

@@ -1,5 +1,5 @@
 import {defineStore} from "pinia";
-import {Airline, routeTerrain} from "@/types/entityoptions.ts";
+import {Airline} from "@/types/entityoptions.ts";
 type layer = {
     lName: string
     lId: string
@@ -12,17 +12,13 @@ export const useLayerStore = defineStore('LayerStore', {
     state: ()=>{
         return {
             Layers: [] as layer[],
-            openDetect: true,
-            validYCData: false,
             navi: {
                 airlines: [] as Airline[],
-                currentRouteID: -1,  //当前航线号
-                nextRouteID: -1,     //下一航线号
-                nextPoint: -1,       //下一航点号
-                distonext: -1,       //待飞距离
-                hFactor: 3         //高度修正数
+                currentRouteID: undefined,  //当前航线号
+                nextRouteID: undefined,     //下一航线号
+                nextPoint: undefined,       //下一航点号
+                distonext: undefined,       //待飞距离
             },
-            routesTerrain: [] as routeTerrain[]
         }
     },
     actions: {

src/store/staticOptions.js

@@ -1,7 +1,5 @@
 import {defineStore} from "pinia";
 import cesiumAirPlane from "@/assets/models/Cesium_Air.glb";
-import fp985Plane from "@/assets/models/FP-985.gltf";
-import fp98Plane from "@/assets/models/fp-98.gltf";
 
 export const useStaticStore = defineStore('staticOptions',{
     state: ()=>{
@@ -13,7 +11,7 @@ export const useStaticStore = defineStore('staticOptions',{
             },
             menuOptions:{
                 EditOptions: [
-                    {label: '绘制航线', key: 'createLine'},
+                    {label: '查询航线', key: 'requestLine'},
                     {label: '航线管理', key: 'manage'}
                 ],
                 sceneOptions:[
@@ -53,8 +51,6 @@ export const useStaticStore = defineStore('staticOptions',{
             },
             models: {
                 defaultAirPlane: cesiumAirPlane,
-                fp985: fp985Plane,
-                fp98: fp98Plane
             },
             hasPlane: false,
             uav: {

src/styles/cesium-compass.css

@@ -49,7 +49,7 @@ screen and (max-height: 420px) {
 .navigation-controls {
     position: absolute;
     right: 1.8rem;
-    top: 55vh;
+    top: 65vh;
     width: 2rem;
     border: 1px solid rgba(255, 255, 255, 0.8);
     border-radius: .3rem .3rem .3rem .3rem;
@@ -107,7 +107,7 @@ screen and (max-height: 420px) {
     pointer-events: auto;
     position: absolute;
     right: 0;
-    top: 41vh;
+    top: 50vh;
     width: 6rem;
     height: 6rem;
     overflow: hidden;

src/types/entityoptions.ts

@@ -30,7 +30,6 @@ export type UavDynamicInfo = {
   uavType: string,
   uavFlightControlSn?: string,
   heading:number,
-  pitch:number,
   lon:number,
   lat:number,
   alt:number,
@@ -53,10 +52,4 @@ export type Airline = {
   isClose: boolean,
   totalDistance: number,
   points: AirlinePoint[],
-}
-
-export type routeTerrain = {
-  routeID: number,
-  distanceArray: number[],
-  elevationArray: number[],
-}
+}

src/utils/map/SpatialAnalysis.ts

@@ -8,12 +8,10 @@ import {getDistance, getElevation} from "@/utils/map/geocomputation.ts";
 import {Cartesian3, Viewer} from "cesium";
 import * as echarts from "echarts";
 import {EChartsType} from "echarts";
-import {Airline} from "@/types/entityoptions.ts";
 type ProfileResult = {
  distanceArray:number[],
  elevationArray:number[],
 }
-
 /**
  * 两点间地形剖面分析数值计算
  * @param viewer 地图Viewer
@@ -76,36 +74,6 @@ export function profileAnalyse(viewer: Viewer, polyline:Cartesian3[], interval:
  return result
 }
 
-/**
- * 折线段地形剖面分析数值计算（异步处理函数）
- * @param viewer 地图Viewer
- * @param route 航线
- * @param interval 线段采样间隔 m为单位
- * @return 从折线起点至终点剖面线的海拔高度数组
- */
-export function profileAnalyse_promise(viewer: Viewer, route: Airline, interval: number){
- return new Promise((resolve) => {
-  let result: ProfileResult = { distanceArray:[], elevationArray:[] }
-  let polyline = []
-  //航线转为坐标点数组
-  route.points.forEach(point => {
-   polyline.push(Cartesian3.fromDegrees(point.lon, point.lat,point.alt))
-  })
-  let temp_dis = 0  //每两点之间的距离
-  for (let i = 0; i <= polyline.length - 2; i++) {
-   let temp = elevationProfile(viewer, polyline[i], polyline[i+1], interval)
-   result.elevationArray = result.elevationArray.concat(temp.elevationArray)
-   temp.distanceArray.forEach(distance => {
-    result.distanceArray.push(distance+temp_dis)
-   })
-   if(temp.distanceArray.length > 0){
-    temp_dis += temp.distanceArray[temp.distanceArray.length-1]
-   }
-  }
-  resolve(result)
- })
-}
-
 /**
  * 两点间通视分析（基于最大斜率的算法） <br>
  * 返回值：通视为true，不通视为false，异常返回undefined
@@ -283,18 +251,10 @@ export function drawEchartsProfileAnalyse(xData:number[], yData:number[]) {
  * @param xData x数组
  * @param yData y数组，以面积线绘制
  * @param height 水平辅助线的高度
- * @param max_distance 预先探测距离
  */
-export function drawEcharts_CollisionDetection(myChart: EChartsType, xData:number[], yData:number[], height:number,max_distance:number) {
+export function drawEcharts_CollisionDetection(myChart: EChartsType, xData:number[], yData:number[], height:number) {
  // 绘制图表
  myChart.setOption({
-  /** 配置图标离容器上下左右的距离 */
-  grid: {
-   top: "20%",
-   right: "5%",
-   left:"10%",
-   bottom: "12%",
-  },
   legend: {
    show: true,
    type: 'plain',
@@ -327,13 +287,13 @@ export function drawEcharts_CollisionDetection(myChart: EChartsType, xData:numbe
    formatter:'地表高度: {c0}'
   },
   xAxis: {
-   max: Math.ceil(max_distance).toString(),
    data: xData,
+   name: '距离/米',
    nameTextStyle: {
     fontWeight:'bolder',
-    fontSize: 14,
+    fontSize: 14
    },
-   nameLocation: 'bottom',
+   nameLocation: 'end',
    axisLine:{
     onZero: false,
     show: true,    // 是否显示坐标轴轴线
@@ -341,7 +301,7 @@ export function drawEcharts_CollisionDetection(myChart: EChartsType, xData:numbe
     symbolSize: [7, 10]
    },
    axisLabel: {
-    formatter: '{value} m',
+    formatter: '{value}',
     margin: 5,
    },
    axisTick: {
@@ -357,12 +317,6 @@ export function drawEcharts_CollisionDetection(myChart: EChartsType, xData:numbe
   yAxis: {
    type: 'value',
    name: '高度/米',
-   max: (value:any)=>{
-    return Math.floor(Math.max(value.max,height) * 1.01)
-   },
-   min: (value:any)=>{
-    return Math.floor(value.min * 0.99)
-   },
    nameTextStyle: {
     fontWeight:'bolder',
     fontSize: 14
@@ -378,6 +332,23 @@ export function drawEcharts_CollisionDetection(myChart: EChartsType, xData:numbe
     symbolSize: [7, 10]
    }
   },
+  visualMap: {
+   type: 'piecewise',
+   show: false,
+   dimension: 1,
+   // seriesIndex: [0, 1], // 虽然可以指定多个series，但是线的颜色只能设置一条
+   seriesIndex: [0, 1],
+   pieces: [{
+    gt: height,
+    color: 'red'
+   }, {
+    lt: 0,
+    color: 'blue'
+   }],
+   outOfRange: { // 在选中范围外 的视觉元素，这里设置在正常范围内的图形颜色
+    color: 'blue',
+   },
+  },
   series: [
    {
     name:'地形',
@@ -391,7 +362,7 @@ export function drawEcharts_CollisionDetection(myChart: EChartsType, xData:numbe
      name: "飞机高度",
      data: [
       {
-       yAxis: height.toString(),
+       yAxis: height,
        itemStyle: {
         normal: { color: '#c60c30' }
        }
@@ -423,120 +394,6 @@ export function drawEcharts_CollisionDetection(myChart: EChartsType, xData:numbe
  }, false);
 }
 
-/**
- *  绘制（更新）地形碰撞检测剖面图
- * @param myChart ECharts对象
- * @param xData x数组
- * @param yData y数组，以面积线绘制
- * @param yData2 y数组2，以折线绘制
- */
-export function drawEcharts_CollisionDetection2(myChart: EChartsType, xData:number[], yData:number[], yData2: number[]) {
- // 绘制图表
- myChart.setOption({
-  /** 配置图标离容器上下左右的距离 */
-  grid: {
-   top: "20%",
-   right: "5%",
-   left:"10%",
-   bottom: "12%",
-  },
-  legend: {
-   show: true,
-   type: 'plain',
-   top: '5%',
-   data:[
-    {
-     name: '地表高度',
-     itemStyle: 'inherit',
-     lineStyle: 'inherit',
-    },
-    {
-     name: '飞机高度',
-     lineStyle: 'inherit',
-    }
-    ]
-  },
-  tooltip: {
-   show: true,
-   trigger: 'axis',
-   axisPointer: {
-    type: 'cross'
-   },
-   formatter:'地表高度: {c0}<br>飞机高度: {c1}'
-  },
-  xAxis: {
-   data: xData,
-   // name: '距离/米',
-   nameTextStyle: {
-    fontWeight:'bolder',
-    fontSize: 14
-   },
-   nameLocation: 'end',
-   axisLine:{
-    onZero: false,
-    show: true,    // 是否显示坐标轴轴线
-    symbol: ['none', 'arrow'],
-    symbolSize: [7, 10]
-   },
-   axisLabel: {
-    formatter: '{value}',
-    margin: 5,
-   },
-   axisTick: {
-    show: true,    // 是否显示坐标轴刻度
-    inside: true,     // 坐标轴刻度是否朝内，默认朝外
-    alignWithLabel: true,
-    lineStyle: {
-     color: '#000000',     //刻度线的颜色
-     type: 'solid',    //坐标轴线线的类型（solid实线类型；dashed虚线类型；dotted点状类型）
-    },
-   }
-  },
-  yAxis: {
-   max: (value:any)=>{
-    return Math.floor(value.max * 1.01)
-   },
-   min: (value:any)=>{
-    return Math.floor(value.min * 0.99)
-   },
-   type: 'value',
-   name: '高度/米',
-   nameTextStyle: {
-    fontWeight:'bolder',
-    fontSize: 14
-   },
-   nameLocation: 'end',
-   position: 'left',
-   axisLabel: {
-    formatter: '{value}'
-   },
-   axisLine: {
-    show: true,
-    symbol: ['none', 'arrow'],
-    symbolSize: [7, 10]
-   }
-  },
-  series: [
-   {
-    name:'地表高度',
-    type: 'line',
-    data: yData,
-    areaStyle: {
-     color: '#37a5fb',
-     opacity: 0.5
-    },
-   },
-   {
-    name: '飞机高度',
-    type: 'line',
-    symbol: 'none',
-    color: 'red',
-    data: yData2,
-   }
-  ]
- }, false);
-}
-
 
 /**
  *  绘制通视分析图 面积线和直线

src/utils/map/geocomputation.ts

@@ -5,15 +5,7 @@
  * @LastEditTime: 2024-04-01 14:05:43
  * @Description: 地理计算
  */
-import {
-  Cartesian3,
-  Cartographic,
-  EllipsoidGeodesic,
-  Math as Cesium_Math, Matrix3,
-  Matrix4,
-  Transforms,
-  Viewer
-} from 'cesium'
+import {Cartesian3, Cartographic, EllipsoidGeodesic, Math as Cesium_Math, Matrix4, Transforms, Viewer} from 'cesium'
 import {Angle} from "@/utils/map/angle.ts";
 
 /**
@@ -169,19 +161,5 @@ export function getElevation(viewer: Viewer, pos: Cartographic|Cartesian3|number
   }
 }
 
-/**
- *  根据起始点、方位角、距离，计算下一点
- * @param position  起始点
- * @param angle 方位角 度（顺时针，正北为0，正东为90）
- * @param distance 距离 米
- * @constructor
- */
-export function ByDirectionAndLen(position: Cartesian3, angle:number, distance:number){
-  let matrix = Transforms.eastNorthUpToFixedFrame(position);
-  let mz = Matrix3.fromRotationZ(2*Cesium_Math.PI - Cesium_Math.toRadians(angle || 0))
-  let rotationZ = Matrix4.fromRotationTranslation(mz);
-  Matrix4.multiply(matrix, rotationZ, matrix);
-  return Matrix4.multiplyByPoint(matrix, new Cartesian3(0, distance, 0),
-      new Cartesian3());
-}
+
 export { getClosestPoint, isOnLineSegment, getDistance, getAzimuth, getPolygonArea }