From 7ce6f4361b22ff88f863ad5293c37d9e8bff0c7d Mon Sep 17 00:00:00 2001 From: quanyawei <401863037@qq.com> Date: Wed, 20 Dec 2023 13:06:25 +0800 Subject: [PATCH] fix:热力图播放 --- src/components/Wind/Map.vue | 514 ++++++++++++++++++++++++++++++++++++--------------------- 1 files changed, 324 insertions(+), 190 deletions(-) diff --git a/src/components/Wind/Map.vue b/src/components/Wind/Map.vue index 1883977..68813ac 100644 --- a/src/components/Wind/Map.vue +++ b/src/components/Wind/Map.vue @@ -5,7 +5,12 @@ element-loading-text="���������" element-loading-background="rgba(0, 0, 0, 0.6)" > - <div v-if="noneData" class="noneData">������������������������������</div> + <div + v-if="noneData" + class="noneData" + > + ������������������������������ + </div> <div class="top"> <span v-for="(item, index) in params" @@ -13,8 +18,7 @@ class="left" :class="{ click: changeColor === index }" @click="change(index)" - >{{ item }}</span - > + >{{ item }}</span> <!-- <span class="middle" @click="toggleWindState()">{{ windStateText }}</span> --> <span class="right">{{ times }}���</span> <span class="dropDown"> @@ -23,13 +27,24 @@ :src="require('@/assets/images/regionalOverview/realTimeImg.png')" alt="" @click="turnState" - /> + > <span class="text_Time">{{ dateFormat }}</span> - <img class="drop-icon" :src="turnImg" alt="" @click="turnState" /> + <img + class="drop-icon" + :src="turnImg" + alt="" + @click="turnState" + > </span> </div> - <div class="topDate" style="height: 60px"> - <div id="eventPro" class="jdt"> + <div + class="topDate" + style="height: 60px" + > + <div + id="eventPro" + class="jdt" + > <div class="mouseDiv"> <span class="inText" /> <div class="sjDiv" /> @@ -111,7 +126,10 @@ <li /> <li /> </div> - <div class="timeDiv" style="position: relative"> + <div + class="timeDiv" + style="position: relative" + > <ul id="timeUl"> <li style="width: 0.83%" /> <li /> @@ -225,7 +243,11 @@ </div> </div> </div> - <regional-overview :key="timerKey" :map="map" :show-flag="showOrHidden" /> + <regional-overview + :key="timerKey" + :map="map" + :show-flag="showOrHidden" + /> <div :style="{ background: 'url(' + bg + ') no-repeat' }" class="buttom-left" @@ -248,7 +270,10 @@ end-placeholder="������������" value-format="yyyy-MM-dd" /> - <el-select v-model="factorValue" placeholder="������������"> + <el-select + v-model="factorValue" + placeholder="������������" + > <el-option v-for="item in factorOptions" :key="item.value" @@ -256,7 +281,10 @@ :value="item.value" /> </el-select> - <el-select v-model="alartValue" placeholder="������������������"> + <el-select + v-model="alartValue" + placeholder="������������������" + > <el-option v-for="item in alertOptions" :key="item.value" @@ -264,7 +292,10 @@ :value="item.value" /> </el-select> - <el-button type="primary" @click="alertData(PageSize, currentPage)"> + <el-button + type="primary" + @click="alertData(PageSize, currentPage)" + > ������ </el-button> </div> @@ -284,8 +315,16 @@ width="50" align="center" /> - <el-table-column property="alarm_time" label="������������" width="150" /> - <el-table-column property="deviceName" label="������������" width="200" /> + <el-table-column + property="alarm_time" + label="������������" + width="150" + /> + <el-table-column + property="deviceName" + label="������������" + width="200" + /> <el-table-column property="index" label="������" @@ -313,8 +352,14 @@ @size-change="handleSizeChange" @current-change="handleCurrentChange" /> - <div slot="footer" class="dialog-footer"> - <el-button size="mini" @click="alarmTableVisible = false"> + <div + slot="footer" + class="dialog-footer" + > + <el-button + size="mini" + @click="alarmTableVisible = false" + > ��� ��� </el-button> </div> @@ -333,7 +378,7 @@ import { WWindUtil } from '@/components/Wind/WRatingArr.js' import RegionalOverview from '@/components/Wind/RegionalOverview' // ������������������ import { mapGetters } from 'vuex' -import { gcj02towgs84 } from '@/assets/json/transform' +// import { gcj02towgs84 } from '@/assets/json/transform' export default { components: { RegionalOverview }, props: { @@ -342,7 +387,7 @@ jingdu: Number, monitorPointId: Number, monitorPointIds: Array, - defaultData: Array, + defaultData: Array }, data () { return { @@ -393,70 +438,70 @@ factorOptions: [ { label: '������������', - value: 'all', + value: 'all' }, { label: 'PM10', - value: 'PM10', + value: 'PM10' }, { label: 'PM2.5', - value: 'PM2.5', + value: 'PM2.5' }, { label: 'SO2', - value: 'SO2', + value: 'SO2' }, { label: 'NO2', - value: 'NO2', + value: 'NO2' }, { label: 'CO', - value: 'CO', + value: 'CO' }, { label: 'O3', - value: 'O3', - }, + value: 'O3' + } ], alertOptions: [ { label: '������������������', - value: 'all', + value: 'all' }, { label: '������', - value: 'overrun', + value: 'overrun' }, { label: '���������', - value: 'sudden', + value: 'sudden' }, { label: '������������������100%', - value: 'state100', + value: 'state100' }, { label: '������������������150%', - value: 'state150', + value: 'state150' }, { label: '������������������250%', - value: 'state250', + value: 'state250' }, { label: '������������������100%', - value: 'city100', + value: 'city100' }, { label: '������������������150%', - value: 'city150', + value: 'city150' }, { label: '������������������250%', - value: 'city250', - }, + value: 'city250' + } ], currentDate: '', turnImg: require('@/assets/images/regionalOverview/dropDown.png'), @@ -476,7 +521,7 @@ } }, computed: { - ...mapGetters(['regionCode']), + ...mapGetters(['regionCode']) }, watch: { dateValue (n, o) { @@ -489,13 +534,14 @@ this.$nextTick(() => { this.canvasWind(newCode) }) - }, + } }, mounted () { this.currentHour() this.$Bus.$on( 'alarmTableVisible', - (res) => ( + res => ( + // eslint-disable-next-line no-sequences (this.alarmTableVisible = res), this.alertData(this.PageSize, this.currentPage) ) @@ -531,8 +577,7 @@ methods: { // ������������������������������ getDayXQ (day) { - var days = new Date() - .getDay() // ������ + var days = new Date().getDay() // ������ var rq = '' // ������ if (day === 'today') { rq = this.newData(0) @@ -603,7 +648,7 @@ p1.innerHTML = this.getDayXQ('beforeYea') var greenInfo = 0 var that = this - ul.onclick = (e) => { + ul.onclick = e => { var target = e.target if (target.tagName.toLowerCase() === 'li') { // ������������li��������������������� @@ -641,7 +686,7 @@ that.getParamsData(true) } // timeUl������������������ - timeUl.onclick = (e) => { + timeUl.onclick = e => { // ������������li��������������������� var target = e.target if (target.tagName.toLowerCase() === 'li') { @@ -676,7 +721,6 @@ lis[i].style.backgroundColor = 'rgba(0,0,0,0.3)' } } - } that.times = 1 that.getParamsData(true) @@ -766,9 +810,8 @@ // ��������������������������� if ( !layer._container && - ('' + $(layer._container) - .attr('class')).replace(/\s/g, '') !== - 'leaflet-layer' + ('' + $(layer._container).attr('class')).replace(/\s/g, '') !== + 'leaflet-layer' ) { layer.remove() } @@ -782,12 +825,11 @@ organizationId: this.$store.state.orgId, regionCode: this.$store.state.regionCode, chooseTime: this.chooseTime, - time: this.nyr, - }, + time: this.nyr + } + }).then(data => { + this.markDeviceSite(data) }) - .then((data) => { - this.markDeviceSite(data) - }) }, // ��������������� markDeviceSite (data) { @@ -795,10 +837,8 @@ this.keyData = data.data.devices // ��������������������� // this.stateControlStation() - var groupIcon = L.layerGroup() - .addTo(this.map) - var groupText = L.layerGroup() - .addTo(this.map) + var groupIcon = L.layerGroup().addTo(this.map) + var groupText = L.layerGroup().addTo(this.map) this.keys = [] for (let i = 0; i < keyData.length; i++) { if (keyData[i].a34002) { @@ -808,16 +848,13 @@ } else if (keyData[i].a21026) { this.keys.push(Math.floor(JSON.parse(keyData[i].a21026))) } else if (keyData[i].a21004) { - this.keys.push(Math.floor(JSON.parse(keyData[i].a21004) - .toFixed(0))) + this.keys.push(Math.floor(JSON.parse(keyData[i].a21004).toFixed(0))) } else if (keyData[i].a21005) { - this.keys.push(JSON.parse(keyData[i].a21005) - .toFixed(3)) + this.keys.push(JSON.parse(keyData[i].a21005).toFixed(3)) } else if (keyData[i].a05024) { this.keys.push(Math.floor(JSON.parse(keyData[i].a05024))) } else if (keyData[i].a99054) { - this.keys.push(JSON.parse(keyData[i].a99054) - .toFixed(3)) + this.keys.push(JSON.parse(keyData[i].a99054).toFixed(3)) } else { // for (let j = 0; j < keyData.length; j++) { this.keys.push(JSON.parse('null')) @@ -830,7 +867,7 @@ // ������������key������������������������������������������������ var colorNum = 7 if (keyData[i].a34002) { - var data = Math.floor(JSON.parse(keyData[i].a34002)) + let data = Math.floor(JSON.parse(keyData[i].a34002)) switch (true) { case data < 0: { colorNum = 7 @@ -868,7 +905,7 @@ break } } else if (keyData[i].a34004) { - var data = Math.floor(JSON.parse(keyData[i].a34004)) + let data = Math.floor(JSON.parse(keyData[i].a34004)) switch (true) { case data < 0: { colorNum = 7 @@ -906,7 +943,7 @@ break } } else if (keyData[i].a21026) { - var data = Math.floor(JSON.parse(keyData[i].a21026)) + let data = Math.floor(JSON.parse(keyData[i].a21026)) switch (true) { case data < 0: { colorNum = 7 @@ -944,9 +981,8 @@ break } } else if (keyData[i].a21004) { - var data = Math.floor( - Math.floor(JSON.parse(keyData[i].a21004) - .toFixed(0)) + let data = Math.floor( + Math.floor(JSON.parse(keyData[i].a21004).toFixed(0)) ) switch (true) { case data < 0: { @@ -985,8 +1021,7 @@ break } } else if (keyData[i].a21005) { - var data = JSON.parse(keyData[i].a21005) - .toFixed(3) + let data = JSON.parse(keyData[i].a21005).toFixed(3) switch (true) { case data < 0: { colorNum = 7 @@ -1024,7 +1059,7 @@ break } } else if (keyData[i].a05024) { - var data = Math.floor(JSON.parse(keyData[i].a05024)) + let data = Math.floor(JSON.parse(keyData[i].a05024)) switch (true) { case data < 0: { colorNum = 7 @@ -1062,8 +1097,7 @@ break } } else if (keyData[i].a99054) { - var data = JSON.parse(keyData[i].a99054) - .toFixed(3) + let data = JSON.parse(keyData[i].a99054).toFixed(3) switch (true) { case data < 0: { colorNum = 7 @@ -1107,19 +1141,19 @@ // iconUrl: require('@/assets/icon/ico2.png'), iconSize: [60, 60], iconAnchor: [30, 48], - className: 'my-device', + className: 'my-device' }) // ��������������������� const iconMarker = L.marker([lat, lng], { - icon: blueIcon, + icon: blueIcon }) groupIcon.addLayer(iconMarker) var myIcon = L.divIcon({ html: this.keys[i], className: 'my-div-icon', iconSize: [60, 60], - iconAnchor: [40, 40], + iconAnchor: [40, 40] }) const TexteMarker = L.marker([lat, lng], { icon: myIcon }) @@ -1145,17 +1179,18 @@ let bgColorList = { pm25colorbg: '', pm10colorbg: '', - so2colorbg: '', //������������ - no210colorbg: '', //������������ - cocolorbg: '', //������������ - o3colorbg: '', //������ - tvoccolorbg: '', //TVOC + so2colorbg: '', // ������������ + no210colorbg: '', // ������������ + cocolorbg: '', // ������������ + o3colorbg: '', // ������ + tvoccolorbg: '' // TVOC } let data = '' + // eslint-disable-next-line no-unused-vars for (let i in keyName) { if (i === 'a34002') { - data = Math.floor(JSON.parse(keyName.a34002)) + data = Math.floor(JSON.parse(keyName.a34002) || 0) switch (true) { case data < 0: { bgColorList.pm10colorbg = '#999999' @@ -1193,7 +1228,7 @@ break } } else if (i === 'a34004') { - data = Math.floor(JSON.parse(keyName.a34004)) + data = Math.floor(JSON.parse(keyName.a34004) || 0) switch (true) { case data < 0: { bgColorList.pm25colorbg = '#999999' @@ -1231,7 +1266,7 @@ break } } else if (i === 'a21026') { - data = Math.floor(JSON.parse(keyName.a21026)) + data = Math.floor(JSON.parse(keyName.a21026) || 0) switch (true) { case data < 0: { bgColorList.so2colorbg = '#999999' @@ -1269,8 +1304,9 @@ break } } else if (i === 'a21004') { - data = Math.floor(Math.floor(JSON.parse(keyName.a21004) - .toFixed(0))) + data = Math.floor( + Math.floor(JSON.parse(keyName.a21004 || 0).toFixed(0)) + ) switch (true) { case data < 0: { bgColorList.no210colorbg = '#999999' @@ -1308,8 +1344,7 @@ break } } else if (i === 'a21005') { - data = JSON.parse(keyName.a21005) - .toFixed(3) + data = JSON.parse(keyName.a21005 || 0).toFixed(3) switch (true) { case data < 0: { bgColorList.cocolorbg = '#999999' @@ -1347,7 +1382,7 @@ break } } else if (i === 'a05024') { - data = Math.floor(JSON.parse(keyName.a05024)) + data = Math.floor(JSON.parse(keyName.a05024) || 0) switch (true) { case data < 0: { bgColorList.o3colorbg = '#999999' @@ -1385,8 +1420,7 @@ break } } else if (i === 'a99054') { - data = JSON.parse(keyName.a99054) - .toFixed(3) + data = JSON.parse(keyName.a99054 || 0).toFixed(3) switch (true) { case data < 0: { bgColorList.tvoccolorbg = '#999999' @@ -1471,28 +1505,41 @@ params: { mac: data.mac, chooseTime: this.chooseTime, - time: this.nyr, - }, + time: this.nyr + } }) - .then((res) => { + .then(res => { if (res.message === '���������������������') { var datafalse = '���������������������' - marker.bindPopup(datafalse) - .openPopup() + marker.bindPopup(datafalse).openPopup() return } this.childerItem.name = res.data.name let colorliststyleBgColor = this.styleBgColor(res.data) console.log('colorliststyleBgColor', colorliststyleBgColor) - let deviceDetails = res.data + let deviceDetails = _.cloneDeep(res.data) + // eslint-disable-next-line no-unused-vars + for (let key in deviceDetails) { + if (deviceDetails[key] === null) { + deviceDetails[key] = '-' + } + } + console.log('deviceDetails', deviceDetails) let windTip = 'inline' let windDeg = 0 let windDir = '' - let dushu = deviceDetails.a01008 === '-' ? '-' : JSON.parse(deviceDetails.a01008) - .toFixed(0) - let levelNumber = deviceDetails.a01007 === '-' ? '0.0' : Number(deviceDetails.a01007) - .toFixed(1) - let level = deviceDetails.a01007 === '0.0' ? '-' : WWindUtil.WindtoLevel(levelNumber).name + let dushu = + deviceDetails.a01008 === '-' + ? '-' + : JSON.parse(deviceDetails.a01008).toFixed(0) + let levelNumber = + deviceDetails.a01007 === '-' + ? '0.0' + : Number(deviceDetails.a01007).toFixed(1) + let level = + deviceDetails.a01007 === '0.0' + ? '-' + : WWindUtil.WindtoLevel(levelNumber).name console.log('level', level) if (deviceDetails.a01008) { var windDirs = dushu === '-' ? 0 : Number(dushu) @@ -1526,6 +1573,7 @@ } } // ������������������������������ + let htmlClassName = 'mypopup' let html = ` <div data-reactroot="" class="marker_maptip"> <div class="marker_title_1nQ"> <span style='color:#66b1ff;cursor: pointer;' onclick='deviceDetail()'>������������</span> @@ -1538,8 +1586,9 @@ <div class="marker_indexpart_2UI"> <div class="marker_indexname_3TP" - style="color: black;background:${colorliststyleBgColor.tvoccolorbg - }" + style="color: black;background:${ + colorliststyleBgColor.tvoccolorbg +}" > TVOC </div> @@ -1552,8 +1601,9 @@ <div class="marker_item_2Kk"> <div class="marker_itemname_Wq5" - style="color: black;background:${colorliststyleBgColor.pm25colorbg - } " + style="color: black;background:${ + colorliststyleBgColor.pm25colorbg +} " > PM2.5 </div> @@ -1564,8 +1614,9 @@ <div class="marker_item_2Kk"> <div class="marker_itemname_Wq5" - style="color: black;background:${colorliststyleBgColor.pm10colorbg - }" + style="color: black;background:${ + colorliststyleBgColor.pm10colorbg +}" > PM10 </div> @@ -1576,8 +1627,9 @@ <div class="marker_item_2Kk"> <div class="marker_itemname_Wq5" - style="color: black;background:${colorliststyleBgColor.so2colorbg - }" + style="color: black;background:${ + colorliststyleBgColor.so2colorbg +}" > SO2 </div> @@ -1588,8 +1640,9 @@ <div class="marker_item_2Kk"> <div class="marker_itemname_Wq5" - style="color: black;background:${colorliststyleBgColor.no210colorbg - }" + style="color: black;background:${ + colorliststyleBgColor.no210colorbg +}" > NO2 </div> @@ -1600,8 +1653,7 @@ <div class="marker_item_2Kk"> <div class="marker_itemname_Wq5" - style="color: black;background:${colorliststyleBgColor.cocolorbg - }" + style="color: black;background:${colorliststyleBgColor.cocolorbg}" > CO </div> @@ -1612,8 +1664,7 @@ <div class="marker_item_2Kk"> <div class="marker_itemname_Wq5" - style="color: black; background:${colorliststyleBgColor.o3colorbg - }" + style="color: black; background:${colorliststyleBgColor.o3colorbg}" > O3 </div> @@ -1630,47 +1681,138 @@ > </div> <div class='windInfor'> - <div>������: ${windDir} ( ${dushu} �� )</div> + <div v-if="false">������: ${windDir} ( ${dushu} �� )</div> <div>������: ${levelNumber} m/s</div> <div>������: ${level}</div> </div> </div> </div>` - marker.bindPopup(html, { className: 'mypopup' }) - .openPopup() + if (deviceDetails.a01007 === '-' && deviceDetails.a01008 === '-') { + htmlClassName = 'mypopupNoWind' + html = ` <div data-reactroot="" class="marker_maptip"> + <div class="marker_title_1nQ"> + <span style='color:#66b1ff;cursor: pointer;' onclick='deviceDetail()'>������������</span> + </div> + <div class="marker_firstline_2WH"> + <div class="marker_citypart_keg"> + <div class="marker_name_small_1VU">${deviceDetails.name}</div> + <div class="marker_time_w5m">${deviceDetails.dataTime}</div> + </div> + <div class="marker_indexpart_2UI"> + <div + class="marker_indexname_3TP" + style="color: black;background:${colorliststyleBgColor.tvoccolorbg}" + > + TVOC + </div> + <div class="marker_indexvalue_1O7"> + ${this.handleCutZero(deviceDetails.a99054)} + </div> + </div> + </div> + <div class="marker_secondline_2Om"> + <div class="marker_item_2Kk"> + <div + class="marker_itemname_Wq5" + style="color: black;background:${colorliststyleBgColor.pm25colorbg} " + > + PM2.5 + </div> + <div class="marker_itemvalue_1l1"> + ${this.handleCutZero(deviceDetails.a34004)} + </div> + </div> + <div class="marker_item_2Kk"> + <div + class="marker_itemname_Wq5" + style="color: black;background:${colorliststyleBgColor.pm10colorbg}" + > + PM10 + </div> + <div class="marker_itemvalue_1l1"> + ${this.handleCutZero(deviceDetails.a34002)} + </div> + </div> + <div class="marker_item_2Kk"> + <div + class="marker_itemname_Wq5" + style="color: black;background:${colorliststyleBgColor.so2colorbg}" + > + SO2 + </div> + <div class="marker_itemvalue_1l1"> + ${this.handleCutZero(deviceDetails.a21026)} + </div> + </div> + <div class="marker_item_2Kk"> + <div + class="marker_itemname_Wq5" + style="color: black;background:${colorliststyleBgColor.no210colorbg}" + > + NO2 + </div> + <div class="marker_itemvalue_1l1"> + ${this.handleCutZero(deviceDetails.a21004)} + </div> + </div> + <div class="marker_item_2Kk"> + <div + class="marker_itemname_Wq5" + style="color: black;background:${colorliststyleBgColor.cocolorbg}" + > + CO + </div> + <div class="marker_itemvalue_1l1"> + ${this.handleCutZero(deviceDetails.a21005)} + </div> + </div> + <div class="marker_item_2Kk"> + <div + class="marker_itemname_Wq5" + style="color: black; background:${colorliststyleBgColor.o3colorbg}" + > + O3 + </div> + <div class="marker_itemvalue_1l1"> + ${this.handleCutZero(deviceDetails.a05024)} + </div> + </div> + </div> + </div>` + } + marker.bindPopup(html, { className: htmlClassName }).openPopup() }) - .catch((err) => { + .catch(err => { console.log(err) }) }, handleCutZero (data) { - - let num = data.substring(0, data.indexOf(".") + 4); - //������������ ������������������������ + let num = data.substring(0, data.indexOf('.') + 4) + // ������������ ������������������������ // let num = Number(data).toFixed(3).toString() let newstr = num - //������������ ������������������ + // ������������ ������������������ let leng = num.length - num.indexOf('.') - 1 - //��������������������� + // ��������������������� if (num.indexOf('.') > -1) { - //������������������ + // ������������������ for (let i = leng; i > 0; i--) { - //������newstr���������0 + // ������newstr���������0 if ( newstr.lastIndexOf('0') > -1 && newstr.substr(newstr.length - 1, 1) === 0 ) { let k = newstr.lastIndexOf('0') - //������������������������������0 ��������������� + // ������������������������������0 ��������������� if (newstr.charAt(k - 1) === '.') { return newstr.substring(0, k - 1) } else { - //������ ������������0 + // ������ ������������0 newstr = newstr.substring(0, k) } } else { - //������������������0 + // ������������������0 return newstr } } @@ -1684,27 +1826,25 @@ params: { mac: data.mac, chooseTime: this.chooseTime, - time: this.nyr, - }, + time: this.nyr + } }) - .then((res) => { + .then(res => { if (res.message === '���������������������') { var datafalse = '���������������������' - this.bindPopup(datafalse) - .openPopup() + this.bindPopup(datafalse).openPopup() return } + // eslint-disable-next-line no-unused-vars for (const key in res.data) { - var tempDecimal = res.data[key].replace(/[^\d.]/g, '') - .split('.')[1] + var tempDecimal = res.data[key].replace(/[^\d.]/g, '').split('.')[1] if (key !== '������' && key !== '������') { if (Number(tempDecimal) === 0) { res.data[key] = parseInt(res.data[key]) + res.data[key].split(' ')[1] } else { res.data[key] = - Number(res.data[key].split(' ')[0]) - .toFixed(2) + + Number(res.data[key].split(' ')[0]).toFixed(2) + res.data[key].split(' ')[1] } } @@ -1713,10 +1853,9 @@ .replace(/,/g, `<br>`) .replace(/{|}|"/g, '') console.log(data) - marker.bindPopup(data) - .openPopup() + marker.bindPopup(data).openPopup() }) - .catch((err) => { + .catch(err => { console.log(err) }) return data @@ -1732,9 +1871,8 @@ // ��������������������������� if ( !layer._container && - ('' + $(layer._container) - .attr('class')).replace(/\s/g, '') !== - 'leaflet-layer' + ('' + $(layer._container).attr('class')).replace(/\s/g, '') !== + 'leaflet-layer' ) { layer.remove() } @@ -1750,7 +1888,7 @@ $.getJSON( 'http://47.99.64.149:8080/api/screen_api_v2/screen/windAndDeviceDataByArea', { monitorPointId: this.$store.state.monitorPointId }, - (data) => { + data => { this.map.setView([data[2], data[1]], 12) // console.log('������������') } @@ -1802,6 +1940,7 @@ } const gisMap_layers = this.map._layers let layer = null + // eslint-disable-next-line no-unused-vars for (const i in gisMap_layers) { if (gisMap_layers[i].options.id === layerName) { layer = gisMap_layers[i] @@ -1820,13 +1959,12 @@ renderer: L.canvas(), zoomControl: false, // ������������ attributionControl: false, // ���������������logol - crs: L.CRS.EPSG3857, // ���������������������EPSG3857���������������������EPSG3395������������������������ EPSG4326 WGS84 + crs: L.CRS.EPSG3857 // ���������������������EPSG3857���������������������EPSG3395������������������������ EPSG4326 WGS84 }) // ������������������ L.tileLayer( 'https://wprd01.is.autonavi.com/appmaptile?lang=zh_cn&size=1&style=7&x={x}&y={y}&z={z}' - ) - .addTo(map) + ).addTo(map) this.map = map // data��������������� // const that = this // this.map.on('mousedown', function(ev) { @@ -1892,9 +2030,8 @@ // ��������������������������� if ( !layer._container && - ('' + $(layer._container) - .attr('class')).replace(/\s/g, '') !== - 'leaflet-layer' + ('' + $(layer._container).attr('class')).replace(/\s/g, '') !== + 'leaflet-layer' ) { layer.remove() } @@ -1911,14 +2048,14 @@ params: { monitorPointIds: this.monitorPointIds.toString(), chooseTime: this.chooseTime, - time: this.nyr, - }, + time: this.nyr + } }) - .then((res) => { + .then(res => { this.windJsonData = res.data[0] return this.windJsonData }) - .catch((err) => { + .catch(err => { console.log(err) }) }, @@ -1935,7 +2072,7 @@ // velocityType: 'Global Wind', velocityType: 'GBR Wind', displayPosition: 'bottomleft', - displayEmptyString: 'No wind data', + displayEmptyString: 'No wind data' }, data: data, // ������ ��������������� // data: data2, @@ -1955,8 +2092,8 @@ '#345B1B', '#186303', '#175103', - '#053F03', - ], + '#053F03' + ] // colorScale: ['#053F03', '#053F03', '#053F03', '#053F03', '#053F03', '#053F03', '#053F03', '#053F03'] }) velocityLayer.addTo(this.map) // ��������������� @@ -1979,22 +2116,21 @@ startTime: this.dateValue[0], endTime: this.dateValue[1], index: this.factorValue, - alarmType: this.alartValue, - }, + alarmType: this.alartValue + } + }).then(res => { + // console.log('������������') + // console.log(res) + var tempData = res.data + // console.log(tempData) + for (let i = 0; i < tempData.alarmInfos.length; i++) { + tempData.alarmInfos[i].alarmInfoId = i + 1 + } + // ������������������tableData + this.gridData = tempData.alarmInfos + // ���������������������������totalCount + this.totalCount = tempData.alarmInfos.length }) - .then((res) => { - // console.log('������������') - // console.log(res) - var tempData = res.data - // console.log(tempData) - for (let i = 0; i < tempData.alarmInfos.length; i++) { - tempData.alarmInfos[i].alarmInfoId = i + 1 - } - // ������������������tableData - this.gridData = tempData.alarmInfos - // ���������������������������totalCount - this.totalCount = tempData.alarmInfos.length - }) }, // ������ // ��������������������� @@ -2012,6 +2148,7 @@ }, // ��������������� tableCellClassName ({ row, column, rowIndex, columnIndex }) { + // eslint-disable-next-line no-unused-vars for (const key in row) { if (key === column.property) { const code = column.property @@ -2048,15 +2185,14 @@ method: 'get', params: { regionCode: 130900, - sensorCode: 'a34002', - }, + sensorCode: 'a34002' + } }) - .then((res) => { + .then(res => { // console.log('���������������') // console.log(res) var gkData = res.data - var group = L.layerGroup() - .addTo(this.map) + var group = L.layerGroup().addTo(this.map) for (let i = 0; i < gkData.length; i++) { var glat = gkData[i].latitude var glng = gkData[i].longitude @@ -2065,25 +2201,23 @@ // iconUrl:require('@/assets/images/tl_PM10.png'), iconSize: [55, 55], iconAnchor: [13, 21], - className: 'my-device', + className: 'my-device' }) // ��������������������� L.marker([glat, glng], { - icon: gIcon, - }) - .addTo(group) + icon: gIcon + }).addTo(group) var myIcon = L.divIcon({ html: gkData[i].data, className: 'my-div-icon-g', - iconSize: 30, + iconSize: 30 }) L.marker([glat, glng], { - icon: myIcon, - }) - .addTo(group) + icon: myIcon + }).addTo(group) } }) - .catch((err) => { + .catch(err => { console.log(err) }) }, @@ -2106,8 +2240,8 @@ }, closeAlarmTableVisible () { this.$store.state.alarmTableVisible = false - }, - }, + } + } } </script> -- Gitblit v1.8.0