From 0b700614e2f3e41df4655ba5469217e009c246ac Mon Sep 17 00:00:00 2001 From: riku <risaku@163.com> Date: 星期一, 24 二月 2025 17:09:13 +0800 Subject: [PATCH] 1. 初步完成走航融合相关功能 --- src/views/satellitetelemetry/SatelliteTelemetry.vue | 110 +++++++++++++++++++++++++++++++++++++++++++----------- 1 files changed, 87 insertions(+), 23 deletions(-) diff --git a/src/views/satellitetelemetry/SatelliteTelemetry.vue b/src/views/satellitetelemetry/SatelliteTelemetry.vue index 0f0698f..d268ece 100644 --- a/src/views/satellitetelemetry/SatelliteTelemetry.vue +++ b/src/views/satellitetelemetry/SatelliteTelemetry.vue @@ -1,15 +1,6 @@ <template> <el-row class="wrap"> <el-col span="2"> - <!-- <el-button - class="p-events-auto" - type="info" - icon="Memo" - plain - @click="draw" - > - 缁樺埗缃戞牸 - </el-button> --> <el-row> <SatelliteManage v-show="show" @@ -21,6 +12,7 @@ @show-rank="handleRankClick" @show-data="handleDataClick" @change-color="handleColorClick" + @change-opacity="handleOpacityClick" ></SatelliteManage> </el-row> </el-col> @@ -34,16 +26,20 @@ </el-row> </el-col> </el-row> - <el-row class="historical" justify="center"> + <SatelliteDataMix class="data-mix" @mix-data="handleMixDataClick"> + </SatelliteDataMix> + <SatelliteMixTool :group-id="3"></SatelliteMixTool> + + <!-- <el-row class="historical" justify="center"> <SatelliteAnimation :loading="animaLoading" :grid-data="gridDataDetailList" :mapViews="mapViews" ></SatelliteAnimation> - </el-row> + </el-row> --> </template> <script setup> -import { map } from '@/utils/map/index_old'; +import { map, onMapMounted } from '@/utils/map/index_old'; import calculate from '@/utils/map/calculate'; import marks from '@/utils/map/marks'; import grid from '@/utils/map/grid'; @@ -51,12 +47,16 @@ import { ref } from 'vue'; import gridApi from '@/api/gridApi'; import SatelliteManage from './component/SatelliteManage.vue'; +import SatelliteDataMix from './component/SatelliteDataMix.vue'; +import SatelliteMixTool from './component/SatelliteMixTool.vue'; import SatelliteProxy from './SatelliteProxy'; import { useFetchData } from '@/composables/fetchData'; import { useSatelliteGridStore } from '@/stores/satellite-grid'; +import { useSceneStore } from '@/stores/scene'; const satelliteGridStore = useSatelliteGridStore(); const { loading, fetchData } = useFetchData(10000); +const sceneStore = useSceneStore(); const animaLoading = ref(true); const show = ref(true); @@ -72,8 +72,13 @@ function onSearch(options) { satelliteGridStore.fetchGridCell(options.id).then(() => { drawGrid(satelliteGridStore.gridInfo); + // initDistrict(); + SatelliteProxy.drawDistrict('闀垮畞鍖�'); }); - satelliteGridStore.fetchGridData(options.id); + satelliteGridStore.fetchGridData(options.id).then(() => { + max = satelliteGridStore.gridDataList.length; + // fetchGridDataDetail(satelliteGridStore.gridDataList); + }); } function fetchGridDataDetail(dataList) { @@ -105,16 +110,46 @@ function drawGrid(gridInfo) { SatelliteProxy.clearAll(mapViews); - mapViews = SatelliteProxy.drawPolyline(gridInfo); + mapViews = SatelliteProxy.drawPolyline(gridInfo, (polygon) => { + //榧犳爣绉诲叆浜嬩欢 + polygon.on('mouseover', () => { + polygon.setOptions({ + //淇敼澶氳竟褰㈠睘鎬х殑鏂规硶 + strokeWeight: 2, + strokeColor: 'red' + }); + }); + //榧犳爣绉诲嚭浜嬩欢 + polygon.on('mouseout', () => { + polygon.setOptions({ + strokeWeight: 1, + strokeColor: 'white' + }); + }); + //榧犳爣鐐瑰嚮浜嬩欢 + polygon.on('click', () => { + const [lng, lat] = polygon.getExtData(); + sceneStore.radius = 0.5; + sceneStore.searchScene(lng, lat); + }); + }); } // 缁樺埗缃戞牸閬ユ劅鏁版嵁鍊煎拰缃戞牸棰滆壊 function drawTextAndColor(gridData) { // SatelliteProxy.clearText(mapViews); + const { resGridViews, pointsRes } = SatelliteProxy.drawColor({ + gridViews: mapViews.gridViews, + points: mapViews.points, + gridDataDetail: gridData, + lastGridViews: mapViews.lastGridViews + }); + mapViews.lastGridViews = resGridViews; + mapViews.lastPoints = pointsRes; // 鏂囨湰鏍囪 const { textViews: dataTxt, labelsLayer: dataLayer } = SatelliteProxy.drawDataText( - mapViews.points, + mapViews.lastPoints, gridData, mapViews.dataTxt, mapViews.dataLayer @@ -123,42 +158,63 @@ mapViews.dataLayer = dataLayer; const { textViews: rankTxt, labelsLayer: rankLayer } = SatelliteProxy.drawRankText( - mapViews.points, + mapViews.lastPoints, gridData, mapViews.rankTxt, mapViews.rankLayer ); mapViews.rankTxt = rankTxt; mapViews.rankLayer = rankLayer; - SatelliteProxy.drawColor(mapViews.gridViews, gridData); } -let selectedGridData +let selectedGridData; function handleRowClick(row) { if (gridDataDetailMap.has(row.id)) { const gridData = gridDataDetailMap.get(row.id); - selectedGridData = gridData + selectedGridData = gridData; drawTextAndColor(gridData); } else { gridApi.fetchGridDataDetail(row.id, row.groupId).then((res) => { gridDataDetailMap.set(row.id, res.data); const gridData = res.data; - selectedGridData = gridData + selectedGridData = gridData; drawTextAndColor(gridData); }); } } function handleRankClick(rankVisible) { - rankVisible ? map.add(mapViews.rankLayer) : map.remove(mapViews.rankLayer); + // rankVisible ? map.add(mapViews.rankLayer) : map.remove(mapViews.rankLayer); + rankVisible ? map.add(mapViews.rankTxt) : map.remove(mapViews.rankTxt); } function handleDataClick(dataVisible) { - dataVisible ? map.add(mapViews.dataLayer) : map.remove(mapViews.dataLayer); + // dataVisible ? map.add(mapViews.dataLayer) : map.remove(mapViews.dataLayer); + dataVisible ? map.add(mapViews.dataTxt) : map.remove(mapViews.dataTxt); } function handleColorClick(isStandardColor) { - SatelliteProxy.drawColor(mapViews.gridViews, selectedGridData, !isStandardColor); + const { resGridViews, pointsRes } = SatelliteProxy.drawColor({ + gridViews: mapViews.gridViews, + points: mapViews.points, + gridDataDetail: selectedGridData, + lastGridViews: mapViews.lastGridViews, + customColor: !isStandardColor + }); + mapViews.lastGridViews = resGridViews; + mapViews.lastPoints = pointsRes; +} + +function handleOpacityClick(isOpacity) { + mapViews.lastGridViews.forEach((e) => { + e.setOptions({ + fillOpacity: isOpacity ? 0.1 : 0.7 + }); + }); +} + +function handleMixDataClick(gridData) { + handleRowClick(gridData); } </script> <style scoped> @@ -170,5 +226,13 @@ bottom: 10px; left: 0; right: 0; + color: #0077ff; +} + +.data-mix { + position: absolute; + right: 0; + top: 60px; + /* color: #0552f7; */ } </style> -- Gitblit v1.9.3