From 8696fefc9628f562ac61de64c5c793238b41ed86 Mon Sep 17 00:00:00 2001
From: guonan <guonan201020@163.com>
Date: 星期一, 21 四月 2025 13:21:03 +0800
Subject: [PATCH] 修改流光线
---
src/views/mnfz.vue | 202 ++++++++++++++++++++++++--------------------------
1 files changed, 96 insertions(+), 106 deletions(-)
diff --git a/src/views/mnfz.vue b/src/views/mnfz.vue
index 12afddf..fade2a7 100644
--- a/src/views/mnfz.vue
+++ b/src/views/mnfz.vue
@@ -1,9 +1,23 @@
<template>
<Left @start="startSimulate" @end="endSimulate" />
- <echartInfo :isDynamicMode="isDynamicMode" :isFinish="isFinish" v-if="loadingSim" />
- <TimeLine v-if="showWaterSimulate" @time-update="timeUpdate" @is-playing="isPlaying"
- :waterSimulateParams="waterSimulateParams" @playbackFinished="playbackFinished" @end="endSimulate" />
- <DebuffDetail v-if="showDebuffDetail" @open="openDetail" @close="showDebuffDetail = false" />
+ <echartInfo
+ :isDynamicMode="isDynamicMode"
+ :isFinish="isFinish"
+ v-if="rightRiverShow"
+ />
+ <TimeLine
+ v-if="showWaterSimulate"
+ @time-update="timeUpdate"
+ @is-playing="isPlaying"
+ :waterSimulateParams="waterSimulateParams"
+ @playbackFinished="playbackFinished"
+ @end="endSimulate"
+ />
+ <DebuffDetail
+ v-if="showDebuffDetail"
+ @open="openDetail"
+ @close="showDebuffDetail = false"
+ />
<DebuffTable v-if="showDebuffTable" @close="closeDebuffTable" />
</template>
@@ -19,18 +33,27 @@
import { createPoint, geomToGeoJSON } from "@/utils/map.js";
import { loadAreaPolygon, clearAreaPolygon } from "@/utils/area";
-import colors from "@/assets/img/left/colors3.png";
import danger from "@/assets/img/left/danger.png";
import { checkedKeys } from "@/store/index";
+
+
+import { useSimStore } from "@/store/simulation";
+import { storeToRefs } from "pinia";
+const simStore = useSimStore();
+const { rightRiverShow } = storeToRefs(simStore);
+
+
const waterSimulateParams = ref({});
const showWaterSimulate = ref(false);
const showDebuffDetail = ref(false);
const showDebuffTable = ref(false);
const isDynamicMode = ref(false);
const isFinish = ref(true);
-const loadingSim = ref(false);
const treeMap = new Map();
+
+
+
// 鎻愪緵鏂规硶缁欐墍鏈夊瓙缁勪欢
provide("simulateActions", {
@@ -41,14 +64,14 @@
function startSimulate(form) {
// console.log("form", form);
showWaterSimulate.value = true;
- loadingSim.value = true
+ rightRiverShow.value = true;
waterSimulateParams.value = form;
}
function endSimulate() {
- loadingSim.value = false
- showDebuffDetail.value = false
+ rightRiverShow.value = false;
+ showDebuffDetail.value = false;
clearTrailLine();
- removeEmergencyPoints()
+ removeEmergencyPoints();
removeDataSources();
setTimeout(() => {
showWaterSimulate.value = false;
@@ -85,7 +108,10 @@
scale: 1.0,
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
- distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 1500),
+ distanceDisplayCondition: new Cesium.DistanceDisplayCondition(
+ 0,
+ 1500
+ ),
},
});
dataSource.entities.add(billboardEntity);
@@ -95,8 +121,7 @@
});
await Promise.all(loadPromises);
setupRowClickListener(dataSources);
- } catch (error) {
- }
+ } catch (error) {}
}
// 娓呴櫎闅愭偅鐐�
function removeDataSources() {
@@ -143,11 +168,17 @@
];
// 杩欓噷鏄坊鍔犻伩闄╃偣瀵屾枃鏈珮浜樉绀�
list.forEach((item) => {
- let point = earthCtrl.factory.createRichTextPoint("閬块櫓鐐�", [item.longitude, item.latitude, item.altitude - 10], {
- distanceDisplayCondition: new SmartEarth.Cesium.DistanceDisplayCondition(0, 2000),
- fontColor: "#ffffff",
- fontSize: 20
- }, "0");
+ let point = earthCtrl.factory.createRichTextPoint(
+ "閬块櫓鐐�",
+ [item.longitude, item.latitude, item.altitude - 10],
+ {
+ distanceDisplayCondition:
+ new SmartEarth.Cesium.DistanceDisplayCondition(0, 2000),
+ fontColor: "#ffffff",
+ fontSize: 20,
+ },
+ "0"
+ );
console.log("point", point);
emergencyAreaList.push(point);
});
@@ -158,10 +189,10 @@
const emergencyAreaList = treeMap.get("閬块櫓鐐�"); // 鑾峰彇瀛樺偍鐨勯伩闄╃偣瀹炰綋鍒楄〃
if (emergencyAreaList && emergencyAreaList.length > 0) {
emergencyAreaList.forEach((entity) => {
- if (entity && typeof entity.deleteObject === 'function') {
+ if (entity && typeof entity.deleteObject === "function") {
// 濡傛灉鏈� deleteObject 鏂规硶锛屼紭鍏堣皟鐢�
entity.deleteObject();
- } else if (entity && typeof entity.clear === 'function') {
+ } else if (entity && typeof entity.clear === "function") {
// 濡傛灉鏈� clear 鏂规硶锛岃皟鐢� clear
entity.clear();
} else if (entity && earthCtrl && earthCtrl.coreMap) {
@@ -173,92 +204,34 @@
}
}
-let TrailLine = [];
-async function showLine() {
- const position = [
- {
- x: -2172540.8322597803,
- y: 4339064.62665997,
- z: 4126183.3895281963,
- },
- {
- x: -2172480.18394144,
- y: 4339033.15167176,
- z: 4126240.9529584926,
- },
- {
- x: -2172454.114348403,
- y: 4339020.0398392705,
- z: 4126261.946960697,
- },
- {
- x: -2172377.9670952093,
- y: 4338976.609385458,
- z: 4126333.862357211,
- },
- {
- x: -2172299.4142002705,
- y: 4338951.971578909,
- z: 4126397.5205803993,
- },
- {
- x: -2172245.1703274297,
- y: 4338940.86037857,
- z: 4126436.276389208,
- },
- {
- x: -2172176.7332184147,
- y: 4338930.525741544,
- z: 4126477.629952572,
- },
- {
- x: -2172173.8151051304,
- y: 4338939.043883864,
- z: 4126469.336927342,
- },
- {
- x: -2172173.7151194704,
- y: 4338939.023235937,
- z: 4126469.4107743693,
- },
- ];
- let LineInterpolation = earthCtrl.core.LineInterpolation(earthCtrl.coreMap, {
- positions: position,
- num: 50,
- getHeight: true,
+// 閬块櫓璺嚎
+let pathLayer = null; // 瀛樺偍鍒涘缓鐨勫浘灞�
+function showLine() {
+ // 鍒涘缓鏂板浘灞�
+ pathLayer = earthCtrl.factory.createPathLayer({
+ url: "/json/line.json",
+ color: "#0033FF",
+ width: 15.0,
+ pointColor: "#FFFFFF",
+ speed: 2,
+ far: 50000,
});
- // console.log(LineInterpolation.height, "A");
-
- let min = LineInterpolation.height;
- let max = min.map((item) => {
- return item + 35;
- });
-
- console.log(min, max);
-
- let _TrailLine = earthCtrl.factory.createTrailLineWall(
- LineInterpolation.positions,
- {
- maximumHeights: max,
- minimumHeights: min,
- color: "#ffffff", //绾块鑹诧紙鍙�夛級
- url: colors,
- }
- );
- TrailLine.push(_TrailLine);
}
-// 娓呴櫎杞ㄨ抗绾垮璞�
+
+// 娓呴櫎閬块櫓璺嚎
function clearTrailLine() {
- TrailLine.forEach((item, index) => {
- if (item && typeof item.deleteObject === 'function') {
- item.deleteObject();
- } else if (item && typeof item.clear === 'function') {
- item.clear();
- } else if (item && earthCtrl && earthCtrl.coreMap) {
- earthCtrl.coreMap.entities.remove(item);
- }
- });
- TrailLine = [];
+ if (pathLayer) {
+ pathLayer.clear();
+ }
+ // if (item && typeof item.deleteObject === "function") {
+ // item.deleteObject();
+ // } else if (item && typeof item.clear === "function") {
+ // item.clear();
+ // } else if (item && earthCtrl && earthCtrl.coreMap) {
+ // earthCtrl.coreMap.entities.remove(item);
+ // }
+ // });
+ // pathLayer = [];
}
function timeUpdate(percentage) {
if (percentage > 99) {
@@ -345,7 +318,9 @@
// 鍒囨崲棰滆壊锛堜緥濡傜孩鑹插拰鍘熷棰滆壊浜ゆ浛锛�
const currentTime = Date.now();
const flashColor = Cesium.Color.RED.withAlpha(1); // 闂姩棰滆壊
- return Math.floor(currentTime / 500) % 2 === 0 ? flashColor : originalColor;
+ return Math.floor(currentTime / 500) % 2 === 0
+ ? flashColor
+ : originalColor;
}, false)
);
// 灏嗛棯鍔ㄧ姸鎬佷繚瀛樺埌瀹炰綋涓婏紝渚夸簬鍚庣画鎺у埗
@@ -356,18 +331,33 @@
function stopFlashing(polygonEntity) {
// 鎭㈠鍘熷棰滆壊
const originalColor = polygonEntity._originalColor || Cesium.Color.WHITE; // 濡傛灉娌℃湁鍘熷棰滆壊锛岄粯璁や娇鐢ㄧ櫧鑹�
- polygonEntity.polygon.material = new Cesium.ColorMaterialProperty(originalColor);
+ polygonEntity.polygon.material = new Cesium.ColorMaterialProperty(
+ originalColor
+ );
// 娓呯┖闂姩鐘舵��
polygonEntity._isFlashing = false;
polygonEntity._originalColor = null; // 娓呴櫎淇濆瓨鐨勫師濮嬮鑹�
}
onMounted(() => {
- setupRowClickListener()
+ setupRowClickListener();
getMaxInfluenceAreaData();
});
onUnmounted(() => {
endSimulate();
});
+// // 杞崲鍧愭爣绯伙紝绗涘崱灏斿潗鏍囪浆涓篧GS48
+// const positions = [[-2171569.1995107993, 4338474.198855222, 4127198.938949332]];
+// const wgs84Positions = positions.map((xyz) => {
+// const cartesian = Cesium.Cartesian3.fromArray(xyz);
+// const cartographic = Cesium.Cartographic.fromCartesian(cartesian);
+
+// // 寮у害杞搴�
+// const lon = Cesium.Math.toDegrees(cartographic.longitude);
+// const lat = Cesium.Math.toDegrees(cartographic.latitude);
+// const height = cartographic.height; // 鍗曚綅锛氱背
+
+// return [lon, lat, height];
+// });
</script>
<style lang="less" scoped>
@import url("../assets/css/home.css");
--
Gitblit v1.9.3