From 67597e4129af701c6e1f2c8da113f2d6a9760f8a Mon Sep 17 00:00:00 2001 From: quanyawei <401863037@qq.com> Date: Wed, 13 Mar 2024 11:31:00 +0800 Subject: [PATCH] fix: 走航报告下载修改 --- src/views/hotMap/index.vue | 239 +++++++++++++++++++++++++++++++++++++---------------------- 1 files changed, 150 insertions(+), 89 deletions(-) diff --git a/src/views/hotMap/index.vue b/src/views/hotMap/index.vue index 9043c66..b788b45 100644 --- a/src/views/hotMap/index.vue +++ b/src/views/hotMap/index.vue @@ -26,7 +26,6 @@ v-model="orgId" size="small" placeholder="���������" - disabled @change="regionData" > <el-option @@ -102,11 +101,11 @@ heatmap: null, markerClusterer: null, orgData: [], - orgId: 71, + orgId: null, city: '������', formInline: { - city: '���������', - cityCode: '210300', + city: '', + cityCode: '', dayType: 'hour', starTime: '', endTime: '', @@ -118,13 +117,13 @@ maxNumber: 500, src: require('@/assets/images/tl_PM10.png'), gradient: { - '0': '#12a112', - '0.1': '#12a112', - '0.3': '#feff01', - '0.5': '#fd8200', - '0.7': '#fd0001', - '0.84': '#95014b', - '1': '#7e0226' + 0: '#12a112', + 0.1: '#12a112', + 0.3: '#feff01', + 0.5: '#fd8200', + 0.7: '#fd0001', + 0.84: '#95014b', + 1: '#7e0226' }}, sensorArr: [ { code: 'a34002', @@ -132,91 +131,93 @@ maxNumber: 500, src: require('@/assets/images/tl_PM10.png'), gradient: { - '0': '#12a112', - '0.1': '#12a112', - '0.3': '#feff01', - '0.5': '#fd8200', - '0.7': '#fd0001', - '0.84': '#95014b', - '1': '#7e0226' + 0: '#12a112', + 0.1: '#12a112', + 0.3: '#feff01', + 0.5: '#fd8200', + 0.7: '#fd0001', + 0.84: '#95014b', + 1: '#7e0226' }}, { code: 'a34004', name: 'PM2.5', maxNumber: 350, src: require('@/assets/images/tl_PM2.5.png'), gradient: { - '0': '#12a112', - '0.1': '#12a112', - '0.21': '#feff01', - '0.32': '#fd8200', - '0.42': '#fd0001', - '0.71': '#95014b', - '1': '#7e0226' + 0: '#12a112', + 0.1: '#12a112', + 0.21: '#feff01', + 0.32: '#fd8200', + 0.42: '#fd0001', + 0.71: '#95014b', + 1: '#7e0226' } }, { code: 'a21026', name: 'SO2', - maxNumber: 1000, + maxNumber: 150, src: require('@/assets/images/tl_SO2.png'), gradient: { - '0': '#12a112', - '0.05': '#12a112', - '0.15': '#feff01', - '0.47': '#fd8200', - '0.8': '#fd0001', - '0.9': '#95014b', - '1': '#7e0226' - } }, + 1: '#feff01', + 0.3: '#12a112', + } + }, { code: 'a21004', name: 'NO2', - maxNumber: 750, + maxNumber: 400, src: require('@/assets/images/tl_NO2.png'), gradient: { - '0': '#12a112', - '0.05': '#12a112', - '0.1': '#feff01', - '0.24': '#fd8200', - '0.37': '#fd0001', - '0.75': '#95014b', - '1': '#7e0226' + 0: '#12a112', + 0.1: '#12a112', + 0.15: '#feff01', + 0.19: '#feff01', + 0.20: '#fd8200', + 0.25: '#fd8200', + 0.45: '#fd8200', + 0.5: '#fd0001', + 0.7: '#95014b', + 1: '#7e0226' }}, { code: 'a21005', name: 'CO', maxNumber: 48, src: require('@/assets/images/tl_CO.png'), gradient: { - '0.0': '#12a112', - '0.04': '#12a112', - '0.083': '#feff01', - '0.29': '#fd8200', - '0.5': '#fd0001', - '0.75': '#95014b', - '1': '#7e0226' + 0.0: '#12a112', + 0.04: '#12a112', + 0.083: '#feff01', + 0.29: '#fd8200', + 0.5: '#fd0001', + 0.75: '#95014b', + 1: '#7e0226' }}, { code: 'a05024', name: 'O3', - maxNumber: 1000, + maxNumber: 500, src: require('@/assets/images/tl_O3.png'), gradient: { - '0': '#12a112', - '0.16': '#12a112', - '0.2': '#feff01', - '0.3': '#fd8200', - '0.4': '#fd0001', - '0.8': '#95014b', - '1': '#7e0226' + 0: '#12a112', + 0.32: '#12a112', + 0.33: '#feff01', + 0.4: '#feff01', + 0.41: '#fd8200', + 0.6: '#fd8200', + 0.61: '#fd0001', + 0.8: '#fd0001', + 0.9: '#95014b', + 1: '#7e0226' } }, { code: 'a99054', name: 'TVOC', maxNumber: 4, src: require('@/assets/images/tl_TVOCNew.png'), gradient: { - '0': '#12a112', - '0.12': '#12a112', - '0.25': '#feff01', - '0.375': '#fd8200', - '0.5': '#fd0001', - '0.75': '#95014b', - '1': '#7e0226' + 0: '#12a112', + 0.12: '#12a112', + 0.25: '#feff01', + 0.375: '#fd8200', + 0.5: '#fd0001', + 0.75: '#95014b', + 1: '#7e0226' }} ], heatMapData: [], @@ -225,6 +226,7 @@ speed: 2 }, polygon: null, + districtSearch: null, dateTimes: [], activeItem: {}, markerList: [] @@ -249,18 +251,18 @@ }, deep: true }, - 'formInline.city': { - handler: function (newVal, oldVal) { - console.log('newVal', newVal === '') - if (newVal !== '') { - this.init1() - if (!!this.formInline.starTime && !!this.formInline.endTime) { - this.onSubmit() - } - } - }, - deep: true - }, + // 'formInline.city': { + // handler: function (newVal, oldVal) { + // console.log('newVal', newVal === '') + // if (newVal !== '') { + // this.init1() + // if (!!this.formInline.starTime && !!this.formInline.endTime) { + // this.onSubmit() + // } + // } + // }, + // deep: true + // }, activeItem: { handler (newVal, oldVal) { if (this.markerList.length > 0) { @@ -274,14 +276,12 @@ deep: true } }, + created () { + }, mounted () { let dataTime = dayjs().format('YYYY-MM-DD') this.getOrganizationId() this.getData(`${dataTime} 00`) - this.$nextTick(() => { - this.initMap() - this.createHeatMap() - }) }, destroyed () { @@ -321,7 +321,7 @@ initMap () { var map = new AMap.Map('mapd', { resizeEnable: true, - zooms: [10, 10], + zooms: [1, 10], zoom: 10, }) this.map = map @@ -331,16 +331,17 @@ init1 () { // ������������ var that = this this.map.setCity(this.formInline.city) - console.log('this.formInline.city', this.formInline.cityCode) if (that.polygon) { that.map.remove(that.polygon) + that.map.remove(that.districtSearch) + that.polygon = null + that.districtSearch = null } - console.log('that.polygon', that.polygon) - AMap.plugin('AMap.DistrictSearch', function () { + this.districtSearch = AMap.plugin('AMap.DistrictSearch', function () { new AMap.DistrictSearch({ extensions: 'all', subdistrict: 0 - }).search(that.formInline.city, function (status, result) { // ��������������������������������������������������� + }).search(that.formInline.cityCode, function (status, result) { // ��������������������������������������������������� var outer = [ new AMap.LngLat(-360, 90, true), new AMap.LngLat(-360, -90, true), @@ -380,6 +381,7 @@ } this.heatMapData = [] this.heatMapData = res.data + this.dataProcessing(this.heatMapData) this.heatmap.setDataSet({ data: this.heatMapData, max: this.selectSensor.maxNumber @@ -393,6 +395,45 @@ .catch(err => { console.log(err) }) + }, + dataProcessing (heatMapData) { + // ��������������� + console.log('this.heatMapData', this.heatMapData) + const max = heatMapData.reduce((prev, current) => (prev.count > current.count ? prev : current)).count + + // so2 + if (this.selectSensor.code === 'a21026') { + if (max > 150 && max <= 475) { + this.selectSensor.maxNumber = 475 + this.heatmap.setOptions({ + gradient: { + 0.1: '#12a112', + 0.2: '#feff01', + 0.3: '#feff01', + 0.32: '#fd8200', + 0.4: '#fd8200', + 1: '#fd8200' + } + }) + } + if (max > 475 && max <= 1000) { + this.selectSensor.maxNumber = 1000 + this.heatmap.setOptions({ + gradient: { + 0: '#12a112', + 0.05: '#12a112', + 0.15: '#feff01', + 0.47: '#fd8200', + 0.5: '#fd0001', + 0.8: '#fd0001', + 0.9: '#95014b', + 1: '#7e0226' + } + }) + } + } else if (this.selectSensor.code === 'a05024') { + if (max > 150 && max <= 475) {} + } }, // ��������� setMarkers (curData) { @@ -492,6 +533,14 @@ }) .then(res => { this.orgData = res.data + let cityData = _.find(this.orgData, { id: this.orgId }) + if (this.orgId === 73) { + this.formInline.city = cityData.cityName + this.formInline.cityCode = String(cityData.cityCode) + } else { + this.formInline.city = cityData.areaName + this.formInline.cityCode = String(cityData.areaCode) + } }) .catch(err => { console.log(err) @@ -511,10 +560,16 @@ onSubmit () { if (!!this.formInline.city && !!this.formInline.starTime && !!this.formInline.endTime) { - this.map.clearMap() + // this.map.clearMap() this.getDayListData() this.getData(this.formInline.starTime) - this.init1() + this.$nextTick(() => { + if (this.map) { + this.map.destroy() + } + this.initMap() + this.createHeatMap() + }) // this.map.setZoom(12) } else { this.$message({ @@ -527,8 +582,14 @@ }, regionData (id) { let cityData = _.find(this.orgData, { id: id }) - this.formInline.city = cityData.cityName - this.formInline.cityCode = cityData.cityCode + if (id === 73) { + this.formInline.city = cityData.cityName + this.formInline.cityCode = String(cityData.cityCode) + } else { + this.formInline.city = cityData.areaName + this.formInline.cityCode = String(cityData.areaCode) + } + console.log('cityData', cityData) }, selectHourData (data) { if (data) { -- Gitblit v1.8.0