From 3baa66227be11c149fef6bdec5a1401ed2d3d79d Mon Sep 17 00:00:00 2001 From: quanyawei <401863037@qq.com> Date: Mon, 09 Oct 2023 17:28:55 +0800 Subject: [PATCH] fix:风场粒子修改 --- src/components/Wind/Map.vue | 127 +++++++++++++++++++++++++++--------------- 1 files changed, 81 insertions(+), 46 deletions(-) diff --git a/src/components/Wind/Map.vue b/src/components/Wind/Map.vue index 1f75648..d9d8111 100644 --- a/src/components/Wind/Map.vue +++ b/src/components/Wind/Map.vue @@ -463,7 +463,8 @@ chooseTime: false, dateInfo: '', // ��������������� timeInfo: '', // ��������������� - nyr: '' // ������������������ + nyr: '', // ������������������ + windAllDate: [] } }, computed: { @@ -479,6 +480,9 @@ } }, mounted() { + this.$nextTick(() => { + this.getParamsData() + }) this.currentHour() this.$Bus.$on( 'alarmTableVisible', @@ -500,7 +504,7 @@ // ��������������������� // this.windData() // this.change(0) - this.getParamsData() + this.windDir() this.newDate() // this.alertData(this.PageSize, this.currentPage) @@ -1562,6 +1566,7 @@ // ������������������������ getParamsData() { clearInterval(this.timer) + this.change(this.changeColor) this.timer = setInterval(() => { this.currentHour() this.times-- @@ -1590,13 +1595,24 @@ // this.windDir() // console.log('���������������') // } - setTimeout(() => { - this.change(this.changeColor) - this.times = 300 - }, 100) } }, 1000) }, + + findLayer(layerName) { // ������������������������������ + if (!this.map) { + return null + } + const gisMap_layers = this.map._layers + let layer = null + for (const i in gisMap_layers) { + if (gisMap_layers[i].options.id === layerName) { + layer = gisMap_layers[i] + } + } + return layer + }, + // ��������������������� initMap() { // console.log('������index������map������������') @@ -1607,8 +1623,12 @@ maxZoom: 18, center: [this.weiduNew, this.jingduNew], zoom: 14, - zoomControl: false, // ������������ - attributionControl: false, // ���������������logol + zoomControl: true, // ������������ + trackResize: true, + worldCopyJump: true, + dragging: true, + inertia: true, + attributionControl: true, // ���������������logol crs: L.CRS.EPSG3857 // ���������������������EPSG3857���������������������EPSG3395������������������������ EPSG4326 WGS84 }) // ������������������ @@ -1618,11 +1638,26 @@ // L.tileLayer( // 'http://webrd01.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=7&x={x}&y={y}&z={z}' // ).addTo(map) + const that = this this.map = map // data��������������� + + this.map.on('moveend', function(ev) { + const res = that.findLayer('wmsid') + that.map.removeLayer(res) + that.openWindCanves() + }) + // this.map.on('viewreset', function() { + // console.log('--->viewreset ���������������������') + // }) window.map = map }, // ������������������������ change(index) { + if (this.windState === 1) { + this.initData() + } else if (this.windState === 2) { + this.windDir() + } this.changeColor = index var pr = '' switch (index) { @@ -1658,11 +1693,6 @@ this.sensorKey = pr // ������������������ // this.toggleWindState() - if (this.windState === 1) { - this.initData() - } else if (this.windState === 2) { - this.windDir() - } }, // ��������������������� initData() { @@ -1683,11 +1713,11 @@ } }) } + this.windData() this.deviceMaker() // console.log('������������������') // $.ajaxSettings.async = false // for (let i = 0; i < this.monitorPointIds.length; i++) { - this.windData() // } }, // ��������������� @@ -1702,6 +1732,8 @@ } }) .then((res) => { + this.windAllDate = res.data[0] + this.openWindCanves() // console.log('���������������') // console.log(res) // if (res.data[0][0].data.length === 0) { @@ -1717,38 +1749,6 @@ // data2[0].header.dy = 0.0018464922 // data2[1].header.dy = 0.0018464922 // console.log(data2, 'data2') - var velocityLayer = L.velocityLayer({ - displayValues: false, // ��������������������������������������������������� - displayOptions: { - // ������������������ - // velocityType: 'Global Wind', - velocityType: 'GBR Wind', - displayPosition: 'bottomleft', - displayEmptyString: 'No wind data' - }, - data: res.data[0], // ������ ��������������� - // data: data2, - // ������������������������������������������ - minVelocity: 0, // ��������������������� m/s ��� - maxVelocity: 8, // ��������������������� m/s ��� - velocityScale: 0.1, // ��������������� ( ������������������������ ) - particleAge: 90, // ������������������������������������������ - lineWidth: 1.5, // ��������������������� - particleMultiplier: 1 / 300, // ��������������������� ������������ ��� - frameRate: 15, // ��������������������� - colorScale: [ - '#A2D839', - '#7EB530', - '#6E9F26', - '#4E7522', - '#345B1B', - '#186303', - '#175103', - '#053F03' - ] - // colorScale: ['#053F03', '#053F03', '#053F03', '#053F03', '#053F03', '#053F03', '#053F03', '#053F03'] - }) - velocityLayer.addTo(this.map) // ��������������� // console.log('������������') // console.log(res.data[0]) }) @@ -1756,6 +1756,41 @@ console.log(err) }) }, + openWindCanves() { + var velocityLayer = L.velocityLayer({ + displayValues: true, // ��������������������������������������������������� + id: 'wmsid', + displayOptions: { + // ������������������ + // velocityType: 'Global Wind', + velocityType: 'GBR Wind', + displayPosition: 'bottomleft', + displayEmptyString: 'No wind data' + }, + data: this.windAllDate, // ������ ��������������� + // data: data2, + // ������������������������������������������ + minVelocity: 0, // ��������������������� m/s ��� + maxVelocity: 8, // ��������������������� m/s ��� + velocityScale: 0.1, // ��������������� ( ������������������������ ) + particleAge: 90, // ������������������������������������������ + lineWidth: 1.5, // ��������������������� + particleMultiplier: 1 / 300, // ��������������������� ������������ ��� + frameRate: 15, // ��������������������� + colorScale: [ + '#A2D839', + '#7EB530', + '#6E9F26', + '#4E7522', + '#345B1B', + '#186303', + '#175103', + '#053F03' + ] + // colorScale: ['#053F03', '#053F03', '#053F03', '#053F03', '#053F03', '#053F03', '#053F03', '#053F03'] + }) + velocityLayer.addTo(this.map) // ��������������� + }, // ������������������������������������������������������������������ alertData(n1, n2) { // ������������axios��������������������������� -- Gitblit v1.8.0