From 5c8271a1677dcb3dea15c0638cf3d90b85465cca Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Sun, 20 Apr 2025 17:19:14 +0800
Subject: [PATCH] feat:当前无人机距离机场水平距离等信息显示
---
src/hooks/useTaskWayline/useTaskWayline.js | 144 +++++++++++++++++++++++++++++++++++++----------
1 files changed, 113 insertions(+), 31 deletions(-)
diff --git a/src/hooks/useTaskWayline/useTaskWayline.js b/src/hooks/useTaskWayline/useTaskWayline.js
index 9855e18..d9836ca 100644
--- a/src/hooks/useTaskWayline/useTaskWayline.js
+++ b/src/hooks/useTaskWayline/useTaskWayline.js
@@ -2,7 +2,7 @@
* @Author: shuishen 1109946754@qq.com
* @Date: 2025-04-19 14:24:34
* @LastEditors: shuishen 1109946754@qq.com
- * @LastEditTime: 2025-04-19 19:00:36
+ * @LastEditTime: 2025-04-20 17:18:22
* @FilePath: \command-center-dashboard\src\hooks\useTaskWayline\useTaskWayline.js
* @Description:
*
@@ -21,11 +21,25 @@
import aircraftGltf from '@/assets/gltf/aircraft.gltf'
import CreateFrustum from '@/utils/cesium/frustum/CreateFrustum'
+let EBizCode = {
+ FlightTaskProgress: 'flighttask_progress'
+}
+
export function useTaskWayline () {
let viewer = null
let deviceOsdInfo = null
+ let flighttaskProgressInfo = null
+
+ // watch
let taskWatch = null
+ let flighttaskWatch = null
let deviceWatch = null
+
+ // 航线位置
+ let currentWaylinePostions = []
+ // 当前航点 下标
+ let currentWaypointIndex = null
+ let droneSpeedArr = []
// 解析kmz文件
const parsingFiles = async url => {
@@ -40,7 +54,7 @@
}
const drawWayline = lineObj => {
- const positions = lineObj.Placemark.map(item => {
+ currentWaylinePostions = lineObj.Placemark.map(item => {
const [lon, lat] = item.Point.coordinates.split(',')
return Cartesian3.fromDegrees(Number(lon), Number(lat))
})
@@ -50,7 +64,7 @@
// 起点
viewer.entities.add({
id: 'drone-job-wayline-start',
- position: positions[0],
+ position: currentWaylinePostions[0],
billboard: {
image: new Cesium.ConstantProperty(rwqfdImg),
width: 70,
@@ -61,7 +75,7 @@
// 终点
viewer.entities.add({
id: 'drone-job-wayline-end',
- position: positions[positions.length - 1],
+ position: currentWaylinePostions[currentWaylinePostions.length - 1],
billboard: {
image: new Cesium.ConstantProperty(endPointImg),
width: 30,
@@ -75,7 +89,7 @@
id: 'drone-job-wayline-polyline',
polyline: {
width: 4,
- positions: positions,
+ positions: currentWaylinePostions,
material: new ImageTrailMaterial({
color: { alpha: 1, blue: 1, green: 1, red: 1 },
speed: 20,
@@ -121,12 +135,91 @@
const aircraftEntity = viewer?.entities.getById('aircraftGltf')
const position = Cesium.Cartesian3.fromDegrees(host?.longitude, host?.latitude, host?.height)
+
if (aircraftEntity) {
aircraftEntity.position = new Cesium.ConstantPositionProperty(position)
+
+ const homeDistance = Math.floor(host?.home_distance) || 0
+
+ // 距离下一个航点
+ const nextPoint = currentWaylinePostions[currentWaypointIndex]
+
+ if (!nextPoint) {
+ aircraftEntity.label = {}
+ return
+ }
+
+ const devicePosition = Cesium.Cartesian3.fromDegrees(
+ Number(host.longitude),
+ Number(host.latitude),
+ 0,
+ )
+
+ // 距离下个点位的距离
+ let distance = Cesium.Cartesian3.distance(
+ devicePosition,
+ nextPoint,
+ )
+
+ // 本次航线平面里程
+ let totalDistance = 0
+ currentWaylinePostions.map((cartesian3, index) => {
+ // 两点之间的距离
+ let deviceCurPosition = null
+ if (index === 0) {
+ deviceCurPosition = devicePosition
+ } else {
+ deviceCurPosition = currentWaylinePostions[index - 1]
+ }
+
+ let distance = Cesium.Cartesian3.distance(
+ deviceCurPosition,
+ cartesian3,
+ )
+ totalDistance += distance
+ return Math.round(distance)
+ })
+
+ // 速度
+ let horizontalSpeed = host.horizontal_speed || 0
+ if (
+ !droneSpeedArr.includes(horizontalSpeed) &&
+ horizontalSpeed > 1
+ ) {
+ droneSpeedArr.push(horizontalSpeed)
+ }
+ if (horizontalSpeed < 5) {
+ horizontalSpeed = 10
+ }
+
+ // 预计到达下一个航点时间
+ let arrivalTime = distance / horizontalSpeed
+ if (arrivalTime === Infinity || isNaN(arrivalTime)) {
+ arrivalTime = 0
+ }
+ if (arrivalTime > 60) {
+ const minute = Math.floor(arrivalTime / 60)
+ const second = Math.round(arrivalTime % 60)
+ arrivalTime = `${minute}m${second}s`
+ } else {
+ arrivalTime = Math.round(arrivalTime) + 's'
+ }
+
+ aircraftEntity.label = new Cesium.LabelGraphics({
+ text: `距离机场水平距离:${homeDistance}m\n距离下一个航点:${Math.round(distance)}m\n预计到达下一航点时间:${arrivalTime}\n本次航线平面里程:${Math.round(totalDistance)}m`,
+ font: '13px monospace',
+ showBackground: true,
+ horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
+ verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
+ disableDepthTestDistance: Number.POSITIVE_INFINITY,
+ pixelOffset: new Cesium.Cartesian2(0, -40),
+ show: true,
+ })
+
return
}
- let entity = viewer?.entities.add({
+ viewer?.entities.add({
id: 'aircraftGltf',
position,
label: {},
@@ -136,27 +229,6 @@
minimumPixelSize: 64, // 最小像素尺寸（保证模型远处可见）
maximumScale: 128, // 最大缩放（可选）
},
- })
-
- const homeDistance = Math.floor(host?.home_distance) || 0
- const distance = 1
- const arrivalTime = 1
- const totalDistance = 1
- const usedTime = 1
-
- entity.label = new Cesium.LabelGraphics({
- text: `距离机场水平距离:${homeDistance}m\n距离下一个航点:${Math.round(
- distance,
- )}m\n预计到达下一航点时间:${arrivalTime}\n本次飞行时间:${usedTime}\n本次航线平面里程:${Math.round(
- totalDistance,
- )}m`,
- font: '13px monospace',
- showBackground: true,
- horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
- verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
- disableDepthTestDistance: Number.POSITIVE_INFINITY,
- pixelOffset: new Cesium.Cartesian2(0, -40),
- show: true,
})
}
@@ -174,13 +246,20 @@
})
}
+ const removeWatchs = () => {
+ taskWatch?.()
+ flighttaskWatch?.()
+ deviceWatch?.()
+ }
+
const init = (v, wsInfo, taskDetails) => {
console.log(v, wsInfo, taskDetails)
viewer = v
deviceOsdInfo = computed(() => wsInfo.value?.device_osd)
+ flighttaskProgressInfo = computed(() => wsInfo.value?.flighttask_progress)
- taskWatch?.()
+ removeWatchs()
taskWatch = watch(taskDetails,
() => {
@@ -191,7 +270,11 @@
{ immediate: true }
)
- deviceWatch?.()
+ flighttaskWatch = watch(flighttaskProgressInfo, async () => {
+ const output = flighttaskProgressInfo.value?.data?.output
+
+ currentWaypointIndex = output.ext['current_waypoint_index']
+ })
deviceWatch = watch(deviceOsdInfo, () => {
const host = deviceOsdInfo.value?.data?.host
@@ -213,8 +296,7 @@
mapEntityRemove()
removeEntitys()
- taskWatch?.()
- deviceWatch?.()
+ removeWatchs()
})
return {
--
Gitblit v1.9.3