src/components/monifangzhen/DangerAssess.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
src/components/monifangzhen/echartInfo.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
src/eventBus.js | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
src/utils/tools.js | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
src/views/mnfz.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 |
src/components/monifangzhen/DangerAssess.vue
@@ -22,7 +22,6 @@ </template> <script setup> import echartInfo from "@/components/monifangzhen/echartInfo.vue" import Table from "../tools/Table.vue" </script> <style lang="less" scoped> src/components/monifangzhen/echartInfo.vue
@@ -25,70 +25,21 @@ <p style="cursor: pointer" @click="debuffClick">å¨è对象</p> <div class="echartBox"> <div class="table-container" ref="tableContainer"> <el-table :data="tableData" style="width: 100%; font-size: 10px" height="100%" > <el-table :data="tableData" style="width: 100%; font-size: 10px" height="100%" @row-click="handleRowClick"> <el-table-column label="å½±ååºåç§°" width="30" align="center"> <template #default="scope"> å½±ååº{{ scope.row.zoneId }} </template> </el-table-column> <el-table-column prop="time" label="影忶é´" width="50" align="center" ></el-table-column> <el-table-column prop="population" label="人å(人)" width="23" align="center" ></el-table-column> <el-table-column prop="room" label="æ¿å±(é´)" width="23" align="center" ></el-table-column> <el-table-column prop="households" label="æ·æ°(æ·)" width="23" align="center" ></el-table-column> <el-table-column prop="property" label="财产(ä¸å )" width="23" align="center" ></el-table-column> <el-table-column prop="maxDepth" label="æå¤§æ°´æ·±(ç±³)" width="28" align="center" ></el-table-column> <el-table-column prop="maxVelocity" label="æå¤§æµé(m/s)" width="35" align="center" ></el-table-column> <el-table-column prop="raininess" label="é¨å¼º(mm/h)" width="28" align="center" ></el-table-column> <el-table-column prop="warningLevel" label="é¢è¦ç级" width="28" align="center" ></el-table-column> <el-table-column prop="time" label="影忶é´" width="50" align="center"></el-table-column> <el-table-column prop="population" label="人å(人)" width="23" align="center"></el-table-column> <el-table-column prop="room" label="æ¿å±(é´)" width="23" align="center"></el-table-column> <el-table-column prop="households" label="æ·æ°(æ·)" width="23" align="center"></el-table-column> <el-table-column prop="property" label="财产(ä¸å )" width="23" align="center"></el-table-column> <el-table-column prop="maxDepth" label="æå¤§æ°´æ·±(ç±³)" width="28" align="center"></el-table-column> <el-table-column prop="maxVelocity" label="æå¤§æµé(m/s)" width="35" align="center"></el-table-column> <el-table-column prop="raininess" label="é¨å¼º(mm/h)" width="28" align="center"></el-table-column> <el-table-column prop="warningLevel" label="é¢è¦ç级" width="28" align="center"></el-table-column> </el-table> </div> </div> @@ -99,7 +50,8 @@ <script setup> import * as echarts from "echarts"; import { ref, onMounted, onBeforeUnmount, nextTick, watch } from "vue"; import { EventBus } from "@/eventBus"; // å¼å ¥äºä»¶æ»çº¿ import { ref, onMounted, onBeforeUnmount, nextTick, watch, onUnmounted } from "vue"; import dayjs from "dayjs"; import { getRainfall } from "@/api"; @@ -137,21 +89,43 @@ } } ); // éç½®å¨è对象ä¸çæ°æ® // æ¸ é¤å½æ°===================================================================== // çå¬äºä»¶æ»çº¿çèªå®ä¹äºä»¶ EventBus.on("reset-table", () => { resetTable(); // è°ç¨éç½®è¡¨æ ¼ç彿° }); EventBus.on("clear-echart", () => { clearEchartData(); // è°ç¨æ¸ é¤å½æ° }); // æ¸ é¤ echart1/2æ°æ®ç彿° const clearEchartData = () => { if (myChart1) { const currentOption = myChart1.getOption(); // è·åå½åå¾è¡¨é ç½® currentOption.series.forEach((series) => { series.data = []; // æ¸ ç©ºæ¯ä¸ªç³»åçæ°æ® }); currentOption.xAxis[0].data = []; myChart1.setOption(currentOption); } if (myChart2) { const currentOption = myChart2.getOption(); currentOption.series.forEach((series) => { series.data = []; }); currentOption.xAxis[0].data = []; myChart2.setOption(currentOption); } }; // æ¸ é¤å¨è对象ä¸çæ°æ® const resetTable = () => { // 1. éç½®è¡¨æ ¼æ°æ® currentIndex.value = 0; tableData.value = []; // 2. 忢并鿰å¼å§æ°æ®å è½½ if (dataIntervalId) { clearInterval(dataIntervalId); } startAddingData(); }; // çå¬ç¶ç»ä»¶ä¼ éçæ°æ®åå // çå¬ç¶ç»ä»¶ä¼ éçæ°æ®åå watch( () => props.isDynamicMode, @@ -201,6 +175,12 @@ }, { immediate: true } // ç«å³æ§è¡çå¬å¨ ); // ç¹å»æ°æ®å®ç°é¢çéªå¨ç触å彿° function handleRowClick(row) { console.log("Row clicked:", row); // 触åäºä»¶ï¼å°å½åè¡ç ID åéå°å°å¾ç»ä»¶ EventBus.emit("row-clicked", row.id); } const listData = cityData.listData; const data = ref([ 8.16, 15.38, 13.94, 9.46, 86.42, 71.32, 28.52, 25.9, 13.74, 14.54, 15.53, @@ -1739,8 +1719,6 @@ }; const startAddingData = () => { console.log("Starting timer with jsonData length:", jsonData.value.length); // 妿宿¶å¨å·²åå¨ï¼å æ¸ é¤ if (dataIntervalId) { clearInterval(dataIntervalId); @@ -2390,6 +2368,10 @@ if (myChart2) myChart2.dispose(); window.removeEventListener("resize", handleResize); }); onUnmounted(() => { EventBus.off("reset-table"); // ç§»é¤äºä»¶çå¬ EventBus.off("clear-echart"); }); </script> <style lang="less" scoped> src/eventBus.js
¶Ô±ÈÐÂÎļþ @@ -0,0 +1,5 @@ // src/eventBus.js import mitt from "mitt"; // å建äºä»¶æ»çº¿ export const EventBus = mitt(); src/utils/tools.js
@@ -96,7 +96,7 @@ this.regionTerrain = earthCtrl.factory.createRegionTerrain({}); this.polygonPosition = []; const draw = earthCtrl.shapeTool.createDrawShapeTool(e => { const draw = earthCtrl.shapeTool.createDrawShapeTool((e) => { const polygonI = []; for (const i of e.result) { const ellipsoid = earthCtrl.coreMap.scene.globe.ellipsoid; @@ -170,7 +170,7 @@ CreateLabel(pic, show) { if (show) { earthCtrl.factory.createSimpleGraphic(pic, {}, function (entity) { console.log(entity, "entity"); console.log(entity.polyline.positions.getValue(), "entity"); window.Viewer = earthCtrl.viewer; //å¼å¯ç¼è¾å¹¶å¯ç¨å±æ§å¼¹çª earthCtrl.factory.SimpleGraphic.edit(true, { @@ -187,7 +187,7 @@ // æ°´å¹³æµé spjl() { earthCtrl.measure.horizontalDistance(colorAll, e => { earthCtrl.measure.horizontalDistance(colorAll, (e) => { console.log(e); }).onEnd = () => { console.log("æ°´å¹³æµè·å·²å®æ"); @@ -195,7 +195,7 @@ }, //ç´çº¿æµé jl() { earthCtrl.measure.lineDistance(colorAll, e => { earthCtrl.measure.lineDistance(colorAll, (e) => { console.log(e); }).onEnd = () => { console.log("ç´çº¿æµé已宿"); @@ -203,7 +203,7 @@ }, // åç´æµé czgd() { earthCtrl.measure.height(colorAll, e => { earthCtrl.measure.height(colorAll, (e) => { console.log(e); }).onEnd = () => { console.log("åç´æµè·å·²å®æ"); @@ -217,7 +217,7 @@ tin: true, // æ¯å¦æ¾ç¤ºtinä¸è§ç½ onlyTerrain: false, // æ¯å¦åªæµéç²¾ç»å°å½¢ }, e => { (e) => { console.log(e); } ).onEnd = () => { @@ -245,7 +245,7 @@ if (!this.viewShedTool) { this.syfx(option); } this.viewShedTool.mouseCreate().then(res => { this.viewShedTool.mouseCreate().then((res) => { callback(res); }); }, @@ -300,7 +300,7 @@ polyline: Cesium.Color.fromCssColorString("#ffff0050"), polygon: Cesium.Color.fromCssColorString("#ffff0050"), }, e => {} (e) => {} ); }, qxcl() { @@ -310,7 +310,7 @@ polyline: Cesium.Color.fromCssColorString("#ffff0050"), polygon: Cesium.Color.fromCssColorString("#ffff0050"), }, e => {} (e) => {} ); }, fwjcl() { @@ -320,7 +320,7 @@ polyline: Cesium.Color.fromCssColorString("#ffff0050"), polygon: Cesium.Color.fromCssColorString("#ffff0050"), }, e => {} (e) => {} ); }, // >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>åºæ¯æªå¾<<<<<<<<<<<<<<<<<<<<<<<<<<<<< @@ -375,8 +375,10 @@ this.earthCtrl.factory.createSimpleGraphic( "polygon", { showSize: false, removeEdit: true }, entity => { let postitions = entity.polygon.hierarchy.getValue().positions.reduce((obj, cur) => { (entity) => { let postitions = entity.polygon.hierarchy .getValue() .positions.reduce((obj, cur) => { let lonlat = this.cartesainToDegrees(cur); obj.push([lonlat.lng, lonlat.lat]); return obj; @@ -422,7 +424,7 @@ } hexres.features.forEach((item, index) => { if (turf.booleanContains(polygon, item)) { let newArr = item.geometry.coordinates[0].map(el => { let newArr = item.geometry.coordinates[0].map((el) => { return Cesium.Cartesian3.fromDegrees(el[0], el[1]); }); //ç½æ ¼é¢ @@ -498,10 +500,14 @@ this.RestrictTheHeight.removeFromMap(); this.RestrictTheHeight = null; } earthCtrl.factory.createSimpleGraphic("polygon", { showSize: false }, entity => { earthCtrl.factory.createSimpleGraphic( "polygon", { showSize: false }, (entity) => { let arr = []; entity.polygon.hierarchy.getValue().positions.forEach(position => { let cartographic = SmartEarth.Cesium.Cartographic.fromCartesian(position); entity.polygon.hierarchy.getValue().positions.forEach((position) => { let cartographic = SmartEarth.Cesium.Cartographic.fromCartesian(position); let lat = SmartEarth.Cesium.Math.toDegrees(cartographic.latitude); let lng = SmartEarth.Cesium.Math.toDegrees(cartographic.longitude); arr.push(lng, lat); @@ -510,25 +516,37 @@ if (viewer.terrainProvider) { Cesium.sampleTerrainMostDetailed(viewer.terrainProvider, [ Cesium.Cartographic.fromDegrees(arr[0], arr[1]), ]).then(updatedPositions => { this.RestrictTheHeight = earthCtrl.analysis.createRestrictTheHeight({ ]).then((updatedPositions) => { this.RestrictTheHeight = earthCtrl.analysis.createRestrictTheHeight( { positions: arr, baseHeight: baseHeigh + updatedPositions[0].height, // color: SmartEarth.Cesium.Color.GREEN.withAlpha(0.5), color: SmartEarth.Cesium.Color.fromCssColorString("#ff1515").withAlpha(0.5), }); color: SmartEarth.Cesium.Color.fromCssColorString( "#ff1515" ).withAlpha(0.5), } ); }); } else { this.RestrictTheHeight = earthCtrl.analysis.createRestrictTheHeight({ positions: arr, baseHeight: baseHeigh, color: SmartEarth.Cesium.Color.fromCssColorString("#ff1515").withAlpha(0.5), color: SmartEarth.Cesium.Color.fromCssColorString("#ff1515").withAlpha( 0.5 ), }); } }); } ); }, hcqfxPoint(width) { const pointGraphic = earthCtrl.factory.createSimpleGraphic("point", {}, entity => { const pointGraphic = earthCtrl.factory.createSimpleGraphic( "point", {}, (entity) => { const position = entity.position.getValue(); const { lng, lat } = this.transformCartesianToCoord(position); const pointBuffer = earthCtrl.analysis.createBufferAnalysis({ @@ -538,10 +556,14 @@ }); pointBuffer.initBuffer(); this.Buffers.push(pointBuffer); }); } ); }, hcqfxLine(width) { this.earthCtrl.factory.createSimpleGraphic("polyline", { showSize: false }, entity => { this.earthCtrl.factory.createSimpleGraphic( "polyline", { showSize: false }, (entity) => { const positions = entity.polyline.positions.getValue(); let coordinates = []; for (let i = 0; i < positions.length; i++) { @@ -555,10 +577,14 @@ }); polulineBuffer.initPolylineBuffer(); this.Buffers.push(polulineBuffer); }); } ); }, hcqfxPolygon(width) { this.earthCtrl.factory.createSimpleGraphic("polygon", { showSize: false }, entity => { this.earthCtrl.factory.createSimpleGraphic( "polygon", { showSize: false }, (entity) => { let positions = entity.polygon.hierarchy.getValue().positions; let coordinates = []; for (let i = 0; i < positions.length; i++) { @@ -574,11 +600,12 @@ }); polygonBuffer.initPolylineBuffer(); this.Buffers.push(polygonBuffer); }); } ); }, // 卿è§ååæ dtsyfxPoint(callback) { earthCtrl.factory.createSimpleGraphic("point", {}, entity => { earthCtrl.factory.createSimpleGraphic("point", {}, (entity) => { let position = entity.position.getValue(); let coord = this.transformCartesianToCoord(position); this.earthCtrl.viewer.entities.remove(entity); @@ -681,9 +708,9 @@ polygonArray: [], selectedEntity: null, //éä¸çå®ä½ addPointToMap(row) { const filteArr = this.pointsArray.filter(item => item.type == row.type); const filteArr = this.pointsArray.filter((item) => item.type == row.type); if (filteArr.length > 0) { filteArr.forEach(item => { filteArr.forEach((item) => { item.entity.show = true; }); return; @@ -724,9 +751,9 @@ }); }, hidePointByType(row) { const filteArr = this.pointsArray.filter(item => item.type == row.type); const filteArr = this.pointsArray.filter((item) => item.type == row.type); if (filteArr.length > 0) { filteArr.forEach(item => { filteArr.forEach((item) => { item.entity.show = false; }); } @@ -744,14 +771,14 @@ callback(poiInfo); }, setSelectedEntity(entity) { this.pointsArray.forEach(item => { this.pointsArray.forEach((item) => { if (item.id === entity.id) { item.entity.billboard.image = cameraIconSel; } }); }, clearSelectedEntityStyle(entity) { this.pointsArray.forEach(item => { this.pointsArray.forEach((item) => { if (item.id === entity.id) { item.entity.billboard.image = cameraIcon; } @@ -765,7 +792,7 @@ } }, createPolygonArea(item) { const findItem = this.polygonArray.find(row => row.id === item.id); const findItem = this.polygonArray.find((row) => row.id === item.id); if (findItem) { earthCtrl.viewer.flyTo(findItem.polygon); return; @@ -780,7 +807,9 @@ heightReference: Cesium.HeightReference.CLAMP_TO_GROUND, }, }); var polyPositions = curPolygon.polygon.hierarchy.getValue(Cesium.JulianDate.now()).positions; var polyPositions = curPolygon.polygon.hierarchy.getValue( Cesium.JulianDate.now() ).positions; var polyCenter = Cesium.BoundingSphere.fromPoints(polyPositions).center; //ä¸å¿ç¹ polyCenter = Cesium.Ellipsoid.WGS84.scaleToGeodeticSurface(polyCenter); curPolygon.position = polyCenter; @@ -812,7 +841,7 @@ this.polygonArray.push(obj); }, clearPoygon() { this.polygonArray.forEach(item => { this.polygonArray.forEach((item) => { earthCtrl.viewer.entities.remove(item.polygon); earthCtrl.viewer.entities.remove(item.polyline); }); @@ -855,7 +884,7 @@ if (graphic) { graphic.clear(); } this.Buffers.map(item => { this.Buffers.map((item) => { item.removeFromMap(); }); this.Buffers = []; @@ -899,7 +928,10 @@ GroupID: 0, url: SmartEarthRootUrl + "Workers/image/waterNormals.jpg", }; this.analysisFlood = earthCtrl.analysis.createSubmergence(method, value => {}); this.analysisFlood = earthCtrl.analysis.createSubmergence( method, (value) => {} ); }, clearFlood() { this.analysisFlood && this.analysisFlood.endWater(); src/views/mnfz.vue
@@ -1,23 +1,14 @@ <template> <Left @start="startSimulate" @end="endSimulate" /> <echartInfo :isDynamicMode="isDynamicMode" :isFinish="isFinish" /> <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="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" /> <DebuffTable v-if="showDebuffTable" @close="closeDebuffTable" /> </template> <script setup> import { EventBus } from "@/eventBus"; // å¼å ¥äºä»¶æ»çº¿ import { ref, onMounted, onUnmounted, provide } from "vue"; import TimeLine from "@/components/menu/TimeLine.vue"; import Left from "./left/Left.vue"; @@ -26,6 +17,7 @@ import DebuffTable from "@/components/tools/DebuffTable.vue"; import { getMaxInfluenceArea } from "@/api/index"; 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"; @@ -36,6 +28,9 @@ const showDebuffTable = ref(false); const isDynamicMode = ref(false); const isFinish = ref(true); const loadingSim = ref(false); const treeMap = new Map(); // æä¾æ¹æ³ç»ææåç»ä»¶ provide("simulateActions", { @@ -46,63 +41,138 @@ function startSimulate(form) { // console.log("form", form); showWaterSimulate.value = true; loadingSim.value = true waterSimulateParams.value = form; } function endSimulate() { loadingSim.value = false showDebuffDetail.value = false clearTrailLine(); removeEmergencyPoints() removeDataSources(); setTimeout(() => { showWaterSimulate.value = false; isDynamicMode.value = false; }, 2000); // æ¸ é¤å¨èå¯¹è±¡è¡¨æ ¼å 容 EventBus.emit("reset-table"); // æ¸ é¤é鍿°æ®å 容 EventBus.emit("clear-echart"); }, 1000); } const MaxInfluenceAreaList = ref([]); // åå§å dataSources å ¨å±æ°ç» const dataSources = []; function getTimeMarkers() { // å° list æ°æ®ç geom EPSG:4326 åæ è½¬æ¢ä¸º WGS84 åæ ç³»ç GeoJSON æ°æ® async function getTimeMarkers() { const list = MaxInfluenceAreaList.value; list.forEach((item, index) => { const geojson = JSON.parse(item.geom); // è§£æ geom åæ®µä¸º GeoJSON 对象 Cesium.GeoJsonDataSource.load(geojson).then((dataSource) => { // è®¾ç½®æ ·å¼ï¼å°é¢è²æ¹ä¸ºçº¢è² try { const loadPromises = list.map(async (item) => { const geojson = JSON.parse(item.geom); const dataSource = await Cesium.GeoJsonDataSource.load(geojson); dataSource.entities.values.forEach((entity) => { // entity.polygon.material = new Cesium.Color(1.0, 0.0, 0.0, 0.6); // 红è²ï¼80% ä¸éæåº¦ // entity.polygon.material = new Cesium.Color.YELLOW; // 红è²ï¼80% ä¸éæåº¦ if (!entity.properties) { entity.properties = new Cesium.PropertyBag(); } entity.properties.addProperty("id", item.id); entity.properties.addProperty("warningLevel", item.warningLevel); entity.properties.addProperty("zoneId", item.zoneId); entity.polygon.outlineColor = Cesium.Color.YELLOW; entity.polygon.outline = true; // ä½¿ç¨æä¾ç X, Y, Z åæ ä½ä¸ºå¾æ ä½ç½® const position = Cesium.Cartesian3.fromDegrees(item.X, item.Y, item.Z); // å¨ä¸å¿ç¹ä¸æ¹æ·»å ä¸ä¸ªå¾æ å®ä½ const billboardEntity = viewer.entities.add({ position: position, billboard: { image: danger, // 徿 çè·¯å¾ scale: 1.0, // 徿 ç¼©æ¾æ¯ä¾ verticalOrigin: Cesium.VerticalOrigin.BOTTOM, // 徿 åºé¨å¯¹é½å°ä¸å¿ç¹ heightReference: Cesium.HeightReference.CLAMP_TO_GROUND, // 徿 è´´å° distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 1500), // æ§å¶å¯è§è·ç¦»èå´ (0ç±³å°1500ç±³) image: danger, scale: 1.0, verticalOrigin: Cesium.VerticalOrigin.BOTTOM, heightReference: Cesium.HeightReference.CLAMP_TO_GROUND, distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 1500), }, }); // å°å¾æ å®ä½ä¸å½åæ°æ®æºå ³è dataSource.entities.add(billboardEntity); }); // æ·»å æ°æ®æºå° viewer viewer.dataSources.add(dataSource); dataSources.push(dataSource); }); }); await Promise.all(loadPromises); setupRowClickListener(dataSources); } catch (error) { } } // æ¸ é¤éæ£ç¹ function removeDataSources() { dataSources.forEach((dataSource) => { dataSources.forEach((dataSource, index) => { // éåå½åæ°æ®æºçææå®ä½ const entities = dataSource.entities.values; entities.forEach((entity, entityIndex) => { if (entity.billboard) { viewer.entities.remove(entity); } }); viewer.dataSources.remove(dataSource); }); dataSources.length = 0; } // é¿é©ç¹ï¼ç»¿è²å¯ææ¬ function addTetrahedron(visible) { const emergencyAreaList = []; // è¿éæ¯æ·»å é¿é©ç¹åºå±é¢ç loadAreaPolygon("/json/emergency_area.geojson", true).then((entities) => { emergencyAreaList.push(...entities); }); // console.log('polygon', polygon); let list = [ { name: "尹建åå®¶", longitude: 116.593517, latitude: 40.568391, altitude: 528.45, }, // { // name: "èæ¯æ±å®¶", // longitude: 116.591059, // latitude: 40.574068, // altitude: 528, // }, // { // name: "åå¡", // longitude: 116.597975, // latitude: 40.558199, // altitude: 528, // }, ]; // è¿éæ¯æ·»å é¿é©ç¹å¯ææ¬é«äº®æ¾ç¤º 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"); console.log("point", point); emergencyAreaList.push(point); }); treeMap.set("é¿é©ç¹", emergencyAreaList); } // å é¤é¿é©ç¹ç坿æ¬å®ä½ function removeEmergencyPoints() { const emergencyAreaList = treeMap.get("é¿é©ç¹"); // è·ååå¨çé¿é©ç¹å®ä½å表 if (emergencyAreaList && emergencyAreaList.length > 0) { emergencyAreaList.forEach((entity) => { if (entity && typeof entity.deleteObject === 'function') { // 妿æ deleteObject æ¹æ³ï¼ä¼å è°ç¨ entity.deleteObject(); } else if (entity && typeof entity.clear === 'function') { // 妿æ clear æ¹æ³ï¼è°ç¨ clear entity.clear(); } else if (entity && earthCtrl && earthCtrl.coreMap) { // å¦ææ¯ Cesium å®ä½ï¼ä½¿ç¨ coreMap.entities.remove ç§»é¤ earthCtrl.coreMap.entities.remove(entity); } }); treeMap.set("é¿é©ç¹", []); // æ¸ ç©ºåå¨çé¿é©ç¹å表 } } let TrailLine = []; async function showLine() { const position = [ @@ -190,67 +260,6 @@ }); TrailLine = []; } // function showLine() { // earthCtrl.factory.createSimpleGraphic( // "polyline", // { clampToGround: true }, // (entity) => { // if (entity) { // 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, // }, // ]; // // console.log("positions", positions); // addWall(position, [entity]); // earthCtrl.factory.SimpleGraphic.remove(entity.id); // } // } // ); // } function timeUpdate(percentage) { if (percentage > 99) { if (showDebuffDetail.value) { @@ -259,6 +268,7 @@ checkedKeys.value = ["é¿é©ç¹"]; showDebuffDetail.value = true; getTimeMarkers(); addTetrahedron(); showLine(); } } @@ -282,7 +292,77 @@ function playbackFinished(val) { isFinish.value = val; } // å®ä¹å ¨å±åéåå¨å½åæ£å¨éªå¨çé¢ç let flashingPolygon = null; // æ·»å äºä»¶çå¬å¨ï¼æ¥æ¶æ¥èªè¡¨æ ¼ç»ä»¶çäºä»¶ function setupRowClickListener(dataSources) { if (!Array.isArray(dataSources) || dataSources.length === 0) { console.error("Data sources array is undefined or empty!"); return; } EventBus.on("row-clicked", (id) => { const clickedEntity = findEntityById(id, dataSources); if (clickedEntity) { if (flashingPolygon && flashingPolygon !== clickedEntity) { stopFlashing(flashingPolygon); } startFlashing(clickedEntity); flashingPolygon = clickedEntity; } else { } }); } function findEntityById(id, dataSources) { if (!Array.isArray(dataSources) || dataSources.length === 0) { console.error("Data sources array is undefined or empty!"); return null; } console.log("Searching for ID:", id); for (const dataSource of dataSources) { const entities = dataSource.entities.values; for (const entity of entities) { const entityId = entity.properties?.id?.getValue(); if (String(entityId) === String(id)) { return entity; } } } return null; } // å¼å§éªå¨ææ function startFlashing(polygonEntity) { // åå¨åå§é¢è² const originalColor = polygonEntity.polygon.material.color.getValue(); polygonEntity._originalColor = originalColor; // å°åå§é¢è²ä¿åå°å®ä½ä¸ // å建é¢è²ååçåè°å½æ° let isFlashing = true; // æ è®°æ¯å¦æ£å¨éªå¨ polygonEntity.polygon.material = new Cesium.ColorMaterialProperty( new Cesium.CallbackProperty(() => { if (!isFlashing) return originalColor; // 妿忢éªå¨ï¼æ¢å¤åå§é¢è² // 忢é¢è²ï¼ä¾å¦çº¢è²ååå§é¢è²äº¤æ¿ï¼ const currentTime = Date.now(); const flashColor = Cesium.Color.RED.withAlpha(1); // éªå¨é¢è² return Math.floor(currentTime / 500) % 2 === 0 ? flashColor : originalColor; }, false) ); // å°éªå¨ç¶æä¿åå°å®ä½ä¸ï¼ä¾¿äºåç»æ§å¶ polygonEntity._isFlashing = isFlashing; } // 忢éªå¨ææ function stopFlashing(polygonEntity) { // æ¢å¤åå§é¢è² const originalColor = polygonEntity._originalColor || Cesium.Color.WHITE; // å¦ææ²¡æåå§é¢è²ï¼é»è®¤ä½¿ç¨ç½è² polygonEntity.polygon.material = new Cesium.ColorMaterialProperty(originalColor); // æ¸ ç©ºéªå¨ç¶æ polygonEntity._isFlashing = false; polygonEntity._originalColor = null; // æ¸ é¤ä¿åçåå§é¢è² } onMounted(() => { setupRowClickListener() getMaxInfluenceAreaData(); }); onUnmounted(() => {