From bb39307b8afd7e83e1c5a6d3de8ddfd34c00d72f Mon Sep 17 00:00:00 2001 From: hym Date: Thu, 2 Apr 2026 14:28:23 +0800 Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0=20rov=20=E7=BB=9F=E8=AE=A1?= =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E7=9B=B8=E5=85=B3=E9=80=BB=E8=BE=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/statistics/RovStatistics.vue | 161 ++++++++++++++----------- 1 file changed, 92 insertions(+), 69 deletions(-) diff --git a/src/views/statistics/RovStatistics.vue b/src/views/statistics/RovStatistics.vue index ef27558..97b9a2a 100644 --- a/src/views/statistics/RovStatistics.vue +++ b/src/views/statistics/RovStatistics.vue @@ -5,11 +5,7 @@ {{ currentTitle }} 全部遥控潜水器 - + {{ item.report_name }} @@ -25,59 +21,34 @@
下潜单位
-
+
下潜地图
-
+
- +
- +
- +
- +
- +
- +
@@ -87,8 +58,11 @@ import BarChart from './components/BarChart.vue' import PieChart from './components/PieChart.vue' import { setImageryViewModels } from '../../utils/common' -import { reportList, platformHov, hovUnit, hovUnitYear, hovDiving } from '../../api/statistics' +import { reportList, platformRov, rovUnit, rovUnitYear, rovDiving } from '../../api/statistics' import { filterDictItems } from '../../utils/index' +import { initMapbox, handleWheel, initSprites, triggerLayerClick } from "@/utils/mapbox-utils"; +import { loadVectorLayer, loadJsonLineFeature, loadJsonPointFeature, highlightFeaturesByProperty } from '@/utils/vector-layer-utils' +import { ColorGenerator } from '@/utils/color-generator'; const Cesium = window.Cesium export default { @@ -139,16 +113,31 @@ export default { }, created() { this.getTypeList() - this.getHovList() - this.getHovUnit() - this.gitHovDiving() - this.gitHovUnitYear() + this.getRovList() + this.getRovUnit() + this.gitRovDiving() + this.gitRovUnitYear() this.getChartBar({ year: '2025' }) }, mounted() { - this.imageryViewModels = setImageryViewModels(this.CesiumHostAddr) - this.initCesium() // 初始化航次地图 - this.initBaiduCesium() // 初始化参航单位地图 + initMapbox("workUnitMap_rov", { + tileKey: "gaode", + zoom: 3, + center: [110, 31], + minZoom: 2, + maxZoom: 29 + }); + initMapbox("voyageMap_rov", { + tileKey: "GEBCO_basemap_NCEI", + zoom: 4, + center: [113, 15], + minZoom: 2, + maxZoom: 29 + }); + + // this.imageryViewModels = setImageryViewModels(this.CesiumHostAddr) + // this.initCesium() // 初始化航次地图 + // this.initBaiduCesium() // 初始化参航单位地图 }, beforeDestroy() { // 清理Cesium资源 @@ -171,20 +160,20 @@ export default { this.currentTitle = command this.removeSingleLineImg() if (command === '全部遥控潜水器') { - this.getHovList() - this.gitHovDiving() - this.gitHovUnitYear() + this.getRovList() + this.gitRovDiving() + this.gitRovUnitYear() this.getChartBar({ year: '2025' }) } else { - this.getHovList({ platform_name: command }) - this.gitHovDiving({ platform_name: command }) - this.gitHovUnitYear({ platform_name: command }) + this.getRovList({ platform_name: command }) + this.gitRovDiving({ platform_name: command }) + this.gitRovUnitYear({ platform_name: command }) this.getChartBar({ year: '2025', platform_name: command }) } }, // 汇总统计数据 - getHovList(params = {}) { - platformHov(params).then(res => { + getRovList(params = {}) { + platformRov(params).then(res => { const obj = res.array[0] this.numbers[0].value = obj.diving_total this.numbers[1].value = obj.driver_member_total @@ -193,13 +182,34 @@ export default { }) }, // 下潜单位统计 - getHovUnit() { - hovUnit().then(res => { - // 清除之前的标记 - this.clearBaiduCesiumMarkers() + getRovUnit() { + rovUnit().then(res => { + let geojson = { + type: "FeatureCollection", + features: [] + }; + res.array.forEach(element => { + geojson.features.push({ + type: "Feature", + geometry: { + type: "Point", + coordinates: [element.unit_lon, element.unit_lat] + }, + properties: { + unit_name: element.unit_name, + unit_type: element.unit_type, + create_time: element.create_time, + tsy_id: element.tsy_id + } + }); + }); + loadJsonPointFeature("workUnit", "blue", geojson, "unit_name", "workUnitMap_rov"); - // 创建参航单位标记 - this.createBaiduCesiumMarkers(res.array) + // // 清除之前的标记 + // this.clearBaiduCesiumMarkers() + + // // 创建参航单位标记 + // this.createBaiduCesiumMarkers(res.array) const typeCount = res.array.reduce((acc, unit) => { const type = unit.unit_type acc[type] = (acc[type] || 0) + 1 // 如果类型已存在则计数+1，否则初始化为1 @@ -261,17 +271,23 @@ export default { } }, // 潜次统计 - gitHovDiving(params = {}) { - hovDiving(params).then(res => { + gitRovDiving(params = {}) { + rovDiving(params).then(res => { + let i = 0; + const colors = ColorGenerator.generateDivergingColors(res.array.length); // 添加轨迹图层 res.array.forEach(item => { - this.addSingleLineImg(item) + // 加载轨迹图层 + loadVectorLayer(item.diving_sn, ["line", "symbol"], [colors[i], "#FFFFFF"], "visible", "voyageMap_rov", "dsds"); + i++; + + // this.addSingleLineImg(item) }) }) }, // 初始化Cesium - 参航单位地图 initBaiduCesium() { - this.baiduCesiumViewer = new Cesium.Viewer(this.$refs.baiduCesiumContainer, { + this.baiduCesiumViewer = new Cesium.Viewer(this.$refs.workUnitMap_rov, { sceneMode: Cesium.SceneMode.SCENE2D, shadows: false, timeline: false, @@ -367,8 +383,8 @@ export default { } }, // 参潜单位年度 - gitHovUnitYear(params = {}) { - hovUnitYear(params).then(res => { + gitRovUnitYear(params = {}) { + rovUnitYear(params).then(res => { const originalData = res.array const sortedData = originalData.sort((a, b) => a.voyage_year - b.voyage_year) this.barData2 = { @@ -391,7 +407,7 @@ export default { }, // 柱状图数据 getChartBar(params) { - platformHov(params).then(res => { + platformRov(params).then(res => { const originalData = res.array const sortedData = originalData.sort((a, b) => a.year - b.year) this.barData1 = { @@ -452,24 +468,29 @@ export default { flex-direction: column; justify-content: center; align-items: center; + .value { font-size: 56px; font-weight: bold; + .unit { font-size: 26px; } } + .label { font-size: 18px; } } } } + .map-module { padding: 50px 50px; display: flex; justify-content: space-between; gap: 50px; + .bezel { flex: 1; width: 100%; @@ -487,6 +508,7 @@ export default { z-index: 8888; font-size: 22px; } + .map-year { position: absolute; top: 20px; @@ -497,6 +519,7 @@ export default { } } } + .echarts-module { padding: 0 50px 50px; display: grid;