From ad57696cef86a678512e93207bc5538d30bc40ee Mon Sep 17 00:00:00 2001
From: 罗广辉 <guanghui.luo@foxmail.com>
Date: Mon, 03 Aug 2026 10:39:46 +0800
Subject: [PATCH] feat: 播放按钮居中
---
applications/drone-command/src/views/detectionCountermeasure/detectionRange/DetectionRangeDialog.vue | 42 +++++++++++++++++++++++++++++++++++++-----
1 files changed, 37 insertions(+), 5 deletions(-)
diff --git a/applications/drone-command/src/views/detectionCountermeasure/detectionRange/DetectionRangeDialog.vue b/applications/drone-command/src/views/detectionCountermeasure/detectionRange/DetectionRangeDialog.vue
index 446ff64..5713bd5 100644
--- a/applications/drone-command/src/views/detectionCountermeasure/detectionRange/DetectionRangeDialog.vue
+++ b/applications/drone-command/src/views/detectionCountermeasure/detectionRange/DetectionRangeDialog.vue
@@ -17,6 +17,7 @@
:terrain="true"
:layer-mode="4"
:boundary="false"
+ :zoom-to-boundary="dialogMode === 'add'"
/>
</div>
@@ -167,7 +168,7 @@
const formRef = ref(null) // 表单实例
const formData = ref(initForm()) // 表单数据
const visible = defineModel() // 弹框显隐
-const dialogMode = ref('add') // 弹框模式
+const dialogMode = ref('') // 弹框模式
const submitting = ref(false) // 提交中
const deviceOptions = ref([])
const dialogReadonly = computed(() => dialogMode.value === 'view')
@@ -310,6 +311,7 @@
width: 40,
height: 56,
verticalOrigin: Cesium.VerticalOrigin.BOTTOM, // 设置图片底部对齐坐标点
+ heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
},
label: {
text: `${longitude.toFixed(6)}, ${latitude.toFixed(6)}`,
@@ -324,7 +326,7 @@
outlineWidth: 1,
outlineColor: Cesium.Color.WHITE,
pixelOffset: new Cesium.Cartesian2(0, -72),
- eyeOffset: new Cesium.Cartesian3(0, 0, -20),
+ heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
},
})
} else {
@@ -332,6 +334,31 @@
redPointEntity.label.text = `${longitude.toFixed(6)}, ${latitude.toFixed(6)}`
}
updateRangeCircle(longitude, latitude, formData.value.effectiveRangeKm)
+}
+
+function flyToRange(longitude, latitude, range) {
+ if (!viewer || longitude == null || latitude == null) return
+ const rangeMeters = Number(range)
+ if (Number.isFinite(rangeMeters) && rangeMeters > 0) {
+ const center = Cesium.Cartesian3.fromDegrees(longitude, latitude)
+ const radius = Math.max(rangeMeters, 1000)
+ const sphere = new Cesium.BoundingSphere(center, radius)
+
+ viewer.camera.flyToBoundingSphere(sphere, {
+ duration: 0,
+ offset: new Cesium.HeadingPitchRange(viewer.camera.heading, Cesium.Math.toRadians(-90), radius * 1.8),
+ })
+ return
+ }
+ viewer.camera.flyTo({
+ destination: Cesium.Cartesian3.fromDegrees(longitude, latitude, 2000),
+ orientation: {
+ heading: viewer.camera.heading,
+ pitch: Cesium.Math.toRadians(-65),
+ roll: 0,
+ },
+ duration: 0,
+ })
}
function parseDeployLocation(value) {
@@ -365,7 +392,7 @@
material: Cesium.Color.fromCssColorString('#6b9ca8').withAlpha(0.6),
outline: true,
outlineColor: Cesium.Color.fromCssColorString('#6b9ca8').withAlpha(0.6),
- heightReference: Cesium.HeightReference.NONE,
+ heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
},
})
return
@@ -411,7 +438,9 @@
function handleMapClick(click) {
const pos = click.position
- const cartesian3 = viewer.camera.pickEllipsoid(pos, viewer.scene.globe.ellipsoid)
+ const ray = viewer.camera.getPickRay(pos)
+ if (!ray) return
+ const cartesian3 = viewer.scene.globe.pick(ray, viewer.scene)
if (!cartesian3) return
const carto = Cesium.Cartographic.fromCartesian(cartesian3)
const longitude = Number(Cesium.Math.toDegrees(carto.longitude).toFixed(6))
@@ -427,6 +456,8 @@
await nextTick()
initMap()
if (dialogMode.value === 'add') {
+ mapRef.value?.zoomToAdminBoundary?.()
+
await loadDeviceOptions()
formData.value = initForm()
return
@@ -449,7 +480,8 @@
const parsed = parseDeployLocation(location)
if (parsed) {
setMapPoint(parsed.longitude, parsed.latitude)
- viewer.flyTo(redPointEntity, { duration: 0 })
+
+ flyToRange(parsed.longitude, parsed.latitude, formData.value.effectiveRangeKm)
}
}
}
--
Gitblit v1.9.3