From 43a2bfaf57e6892a7c2029e496eb8eafa88220c0 Mon Sep 17 00:00:00 2001 From: hym Date: Thu, 25 Dec 2025 16:47:57 +0800 Subject: [PATCH] =?UTF-8?q?=E6=90=9C=E7=B4=A2=E9=A1=B5=E9=9D=A2=E5=A2=9E?= =?UTF-8?q?=E5=8A=A0=E7=9B=B8=E5=85=B3=E4=BA=A4=E4=BA=92=E9=80=BB=E8=BE=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/dataSearch.vue | 89 ++++++++++++++++++++++++++-------------- 1 file changed, 58 insertions(+), 31 deletions(-) diff --git a/src/views/dataSearch.vue b/src/views/dataSearch.vue index 7dea0c1..df7a13d 100644 --- a/src/views/dataSearch.vue +++ b/src/views/dataSearch.vue @@ -36,7 +36,8 @@
@@ -237,9 +238,9 @@ import { setImageryViewModels } from '@/utils/common' import Vue from 'vue' -import { loadVectorLayer } from '@/utils/vector-layer-utils' +import { loadVectorLayer, loadJsonLineFeature, loadJsonPointFeature, highlightFeaturesByProperty } from '@/utils/vector-layer-utils' import { ColorGenerator } from '@/utils/color-generator'; -import { handleWheel } from "@/utils/mapbox-utils"; +import { handleWheel, initSprites, triggerLayerClick } from "@/utils/mapbox-utils"; const Cesium = window.Cesium export default { @@ -248,6 +249,7 @@ export default { return { show: false, viewer: null, + filter: null, color: [Cesium.Color.RED, Cesium.Color.GREEN, Cesium.Color.BLUE, Cesium.Color.CHARTREUSE, Cesium.Color.DARKBLUE], searchType: [ { @@ -643,10 +645,15 @@ export default { let i = 0; const colors = ColorGenerator.generateDivergingColors(arr.length); arr.forEach(item => { - // this.addSingleLineImg(item.voyage_name, null) - // 加载轨迹图层（因样品暂无轨迹数据，暂时不加载轨迹） - // loadVectorLayer(item.voyage_name, ["line", "symbol"], [colors[i], colors[i]], "visible", "dataSearch", "dsds"); + // 添加测线/站位图层 + if (item.job_type == "测线作业") { + loadVectorLayer(`sample_line_${item.dataset_name}`, ["line"], ["#FFFFFF", "#FFFFFF"], "visible", "dataSearch", "dsds", "sample_name"); + } else { + loadVectorLayer(`sample_station_${item.dataset_name}`, ["symbol"], ["#FFFFFF", "#FFFFFF"], "visible", "dataSearch", "dsds", "sample_name"); + } i++; + + // this.addSingleLineImg(item.voyage_name, null) // this.dataList[i].show = true; // this.divingImage(item) }) @@ -658,17 +665,11 @@ export default { dataset_id: item.tsy_id }).then(res => { item.sampleArray = res.array - if (res.array.length) { - let i = 0; - const colors = ColorGenerator.generateDivergingColors(res.array.length); - res.array.forEach(sample => { - console.log(sample); - // this.sampleLineImage(sample) - // 加载轨迹图层（因样品暂无轨迹数据，暂时不加载轨迹） - // loadVectorLayer(sample.sample_name, ["line", "symbol"], [colors[i], colors[i]], "visible", "dataSearch", "dsds"); - i++; - }) - } + // if (res.array.length) { + // res.array.forEach(sample => { + // this.sampleLineImage(sample) + // }) + // } }) } if (item.job_type === '站位作业') { @@ -678,21 +679,15 @@ export default { }).then(res => { item.sampleArray = res.array // 格式化坐标点 - if (res.array.length) { - let i = 0; - const colors = ColorGenerator.generateDivergingColors(res.array.length); - res.array.forEach(sample => { - // this.sampleLineImage(sample) - // 加载轨迹图层（因样品暂无轨迹数据，暂时不加载轨迹） - // loadVectorLayer(sample.sample_name, ["line", "symbol"], [colors[i], colors[i]], "visible", "dataSearch", "dsds"); - i++; - }) - } + // if (res.array.length) { + // res.array.forEach(sample => { + // this.sampleLineImage(sample) + // }); + // } }) } }) this.dataList = voyageList - console.log(this.dataList) }, // 初始化 mapbox @@ -746,6 +741,10 @@ export default { localIdeographFontFamily: "Microsoft YoHei, 'Noto Sans', 'Noto Sans CJK SC', sans-serif", pitch: 0, bearing: 0, + // // 禁用所有旋转和俯仰角控制 + // dragRotate: false, + // touchZoomRotate: false, + // pitchWithRotate: false, // maxBounds: [[-180, -90], [180, 90]],// Set the map's geographical boundaries. antialias: true, attributionControl: false, @@ -769,7 +768,9 @@ export default { // }); }); - handleWheel("dataSearch"); + // handleWheel("dataSearch"); + Vue.config.maps["dataSearch"].scrollZoom.enable(); + initSprites("dataSearch") map.on('load', () => { // 加载海岸线 @@ -856,7 +857,7 @@ export default { // 增加6000米等深线 const contour6000 = new Cesium.WebMapTileServiceImageryProvider( { - url: this.CesiumHostAddr + 'geoserver/gwc/service/wmts/rest/ougp:contour6000/{TileMatrixSet}/{TileMatrixSet}:{TileMatrix}/{TileRow}/{TileCol}?format=image/png', + url: Vue.config.baseUrl + 'geoserver/gwc/service/wmts/rest/ougp:contour6000/{TileMatrixSet}/{TileMatrixSet}:{TileMatrix}/{TileRow}/{TileCol}?format=image/png', layer: 'ougp:contour6000', style: 'default', format: 'image/png', @@ -918,8 +919,34 @@ export default { } }, // 选中样品列表数据 - onSample(sample) { + onSample(sample, job_type) { this.currenSample = sample.tsy_id + if (job_type == "测线作业" && (!sample.start_lon || !sample.start_lat || !sample.end_lon || !sample.end_lat) || job_type == "站位作业" && (!sample.sampling_lon || !sample.sampling_lat)) { + alert('该样品无坐标信息，无法定位！'); + return; + } + let lon = 0; + let lat = 0; + if (job_type == "测线作业") { + // lon = Number(sample.start_lon); + // lat = Number(sample.start_lat); + lon=(Number(sample.start_lon) + Number(sample.end_lon))/2; + lat=(Number(sample.start_lat) + Number(sample.end_lat))/2; + } + if (job_type == "站位作业") { + lon = Number(sample.sampling_lon); + lat = Number(sample.sampling_lat); + } + Vue.config.maps["dataSearch"].setZoom(10); + Vue.config.maps["dataSearch"].flyTo({ + center: [lon, lat], + speed: 10 + }); + let layerId = `vector-${job_type == "测线作业" ? "sample_line" : "sample_station"}_${sample.dataset_name}-${job_type == "测线作业" ? "line" : "symbol"}`; + let sourceLayerId = `${job_type == "测线作业" ? "sample_line" : "sample_station"}_${sample.dataset_name}`; + // vector-sample_station_TS-46-1_FDZ377_Slurp_SWYP-symbol、vector-sample_line_TS2-29-1_SY612_GQXJ_PJZP-line + // highlightFeaturesByProperty("dataSearch", `${job_type == "测线作业" ? "sample_line" : "sample_station"}_${sample.dataset_name}`, layerId, "sample_name", sample.sample_name); + triggerLayerClick("dataSearch", sourceLayerId, layerId, [lon, lat], { "sample_name": sample.sample_name }); }, goHome() { this.$router.push({ name: 'home' })