From f74222e571d9164a59e01194f35ff1e34f10a423 Mon Sep 17 00:00:00 2001 From: quanyawei <401863037@qq.com> Date: Fri, 15 Dec 2023 17:12:33 +0800 Subject: [PATCH] fix:热力图播放 --- src/views/car/index.vue | 567 +++++++++++++++++++++++++++----------------------------- 1 files changed, 275 insertions(+), 292 deletions(-) diff --git a/src/views/car/index.vue b/src/views/car/index.vue index d3ac8e8..ace7c2d 100644 --- a/src/views/car/index.vue +++ b/src/views/car/index.vue @@ -1,45 +1,28 @@ <template> <div class="main_body"> <el-container style="height: 100%"> - <el-aside - v-if="this.$store.state.aside" - width="300px" - style="background-color: rgb(238, 241, 246); padding-top: 10px" - > - <span - style=" + <el-aside v-if="this.$store.state.aside" width="300px" style="background-color: rgb(238, 241, 246); padding-top: 10px"> + <span style=" font-size: 13px; padding-left: 10px; font-weight: 500; color: rgb(64, 158, 255); - " - >���������������</span - > + ">���������������</span> <el-menu style="margin-top: 10px"> - <el-menu-item - v-for="(item, index) in defaultData" - :key="index" - style=" + <el-menu-item v-for="(item, index) in defaultData" :key="index" style=" display: flex; justify-content: space-between; align-items: center; padding-right: 0; border-bottom: 1px solid #eee; - " - :index="(index + 1 + '-' + index + 1).toString()" - @click="changeCarData(item)" - > + " :index="(index + 1 + '-' + index + 1).toString()" @click="changeCarData(item)"> <span>{{ item.name }}</span> - <i - style=" + <i style=" vertical-align: -2.5px; font-size: 20px; margin-right: 10px; margin-left: auto; - " - class="iconfont iconfaxianzuobiao" - @click="deviceDetail(item.mac, null, item, 0)" - /> + " class="iconfont iconfaxianzuobiao" @click="deviceDetail(item.mac, null, item, 0)" /> <!-- @click="deviceDetail('p5dnd7a0245390',null,item,0)"--> </el-menu-item> </el-menu> @@ -48,34 +31,14 @@ <el-container style="position: relative"> <div class="carTop"> <span style="float: left; margin: 1px 10px 0 0"> - <el-button - size="medium" - type="primary" - icon="el-icon-setting" - @click="dialogFormVisible = true" - >6���������</el-button - > + <el-button size="medium" type="primary" icon="el-icon-setting" @click="dialogFormVisible = true">6���������</el-button> </span> - <span - v-for="(item, index) in snesorParams" - :key="index" - class="left" - :class="{ click: changeColor == index }" - @click="changeCode(index)" - >{{ item }} + <span v-for="(item, index) in snesorParams" :key="index" class="left" :class="{ click: changeColor == index }" @click="changeCode(index)">{{ item }} </span> - <span - v-for="(item, index) in viewOptions" - :key="index + '-only'" - class="right" - :class="{ click: changeColor1 == index }" - @click="changeCode1(index)" - >{{ item }} + <span v-for="(item, index) in viewOptions" :key="index + '-only'" class="right" :class="{ click: changeColor1 == index }" @click="changeCode1(index)">{{ item }} </span> <span v-if="webSocketView" style="float: right; margin: 2px 10px 0 0"> - <el-button size="medium" type="primary" @click="wsStart()" - >������������</el-button - > + <el-button size="medium" type="primary" @click="wsStart()">������������</el-button> </span> <!-- <el-date-picker v-if="historyView" @@ -111,32 +74,18 @@ <!-- />--> <!-- </el-select>--> - <el-button - type="primary" - size="small" - style="margin-left: 1.5rem" - @click="insertL" - >������</el-button - > + <el-button type="primary" size="small" style="margin-left: 1.5rem" @click="insertL">������</el-button> + <el-input placeholder="���������������" v-model="inputnum" class="inputNum" clearable> + </el-input> + <div class="insLu"> - <el-upload - class="upload-demo" - ref="upload" - action="" - :on-change="handleChange" - :on-remove="handleRemove" - :file-list="fileList" - :auto-upload="false" - :limit="1" - > - <el-button slot="trigger" size="small" type="primary" - >������������</el-button - > + <el-upload class="upload-demo" ref="upload" action="" :on-change="handleChange" :on-remove="handleRemove" :file-list="fileList" :auto-upload="false" :limit="1"> + <el-button slot="trigger" size="small" type="primary">������������</el-button> <div slot="tip" class="el-upload__tip" style="color: red"> ������������������������(���������������) </div> </el-upload> - <div style="display: flex"> + <!-- <div style="display: flex"> <span class="statspan">������������������:</span ><el-input v-model="startL" style="width: 12rem"></el-input> </div> @@ -155,36 +104,38 @@ <el-button type="primary" @click="insLuDuan">������</el-button> <el-button @click="insqu">������</el-button> <el-button @click="qnull">������</el-button> + </div> --> + <el-table :data="tableData" style="width: 100%"> + <el-table-column label="������������" width="180"> + <template slot-scope="scope"> + <span style="margin-left: 10px">{{ scope.row.start }}</span> + </template> + </el-table-column> + <el-table-column label="������������" width="180"> + <template slot-scope="scope"> + <span style="margin-left: 10px">{{ scope.row.end }}</span> + </template> + </el-table-column> + </el-table> + <div style="display: flex"> + <span class="statspan">������������:</span><el-input v-model="Lname" style="width: 12rem; margin-left: 1.7rem"></el-input> + </div> + <div style="display: flex; margin-left: 4rem"> + <el-button type="primary" @click="insLuDuan">������</el-button> + <el-button @click="insqu">������</el-button> + <el-button @click="qnull">������</el-button> </div> </div> - <el-date-picker - style="float: right; margin-right: 10px" - @change="dateChange" - v-model="dateValue" - type="datetimerange" - :picker-options="threeOptions" - range-separator="���" - start-placeholder="������������" - end-placeholder="������������" - > + <el-date-picker style="float: right; margin-right: 10px" @change="dateChange" v-model="dateValue" type="datetimerange" :picker-options="threeOptions" range-separator="���" start-placeholder="������������" end-placeholder="������������"> </el-date-picker> <!-- ������/��������������������� --> - <el-select - v-model="dataTypeValue" - placeholder="������������" - style=" + <el-select v-model="dataTypeValue" placeholder="������������" style=" float: right; line-height: 40px; margin-right: 10px; width: 103px; - " - > - <el-option - v-for="item in dataTypeList" - :key="item.value" - :label="item.label" - :value="item.value" - /> + "> + <el-option v-for="item in dataTypeList" :key="item.value" :label="item.label" :value="item.value" /> </el-select> </div> <div v-if="noneData" class="noneData">������������������������������</div> @@ -206,12 +157,7 @@ <!-- 6��������������� --> <el-dialog title="6���������" :visible.sync="dialogFormVisible" width="1000px"> <el-descriptions title="������6���" :column="3" border> - <el-descriptions-item - label="PM2.5 | ug/m��" - label-class-name="my-label" - content-class-name="my-content" - >22</el-descriptions-item - > + <el-descriptions-item label="PM2.5 | ug/m��" label-class-name="my-label" content-class-name="my-content">22</el-descriptions-item> <el-descriptions-item label="PM10 | ug/m��">34</el-descriptions-item> <el-descriptions-item label="SO2 | ug/m��">4</el-descriptions-item> <el-descriptions-item label="NO2 | ug/m��">16</el-descriptions-item> @@ -220,16 +166,14 @@ </el-descriptions> <!-- <el-descriptions title="���������������" border> </el-descriptions> --> - <div - style=" + <div style=" font-size: 16px; font-weight: 700; margin: 10px 0 20px 0; font-size: 16px; font-weight: 700; color: #303133; - " - > + "> ��������������� </div> <el-table :data="sensorTableData" border> @@ -458,12 +402,14 @@ 2.0) / 3.0 return ret - }, + } } export default { components: { index }, data() { return { + inputnum: 50, + tableData: [], fileList: [], file: '', insdialogVisible: false, @@ -478,7 +424,7 @@ 'CO', 'O3', 'TVOC', - '���������', + '���������' ], changeColor: 0, changeColor1: 0, @@ -498,7 +444,7 @@ text: '������', onClick(picker) { picker.$emit('pick', new Date()) - }, + } }, { text: '������', @@ -506,7 +452,7 @@ const date = new Date() date.setTime(date.getTime() - 3600 * 1000 * 24) picker.$emit('pick', date) - }, + } }, { text: '���������', @@ -514,9 +460,9 @@ const date = new Date() date.setTime(date.getTime() - 3600 * 1000 * 24 * 7) picker.$emit('pick', date) - }, - }, - ], + } + } + ] }, timeOne: '', threeOptions: { @@ -526,7 +472,7 @@ // ������������������������������������������������������������ if (maxDate) this.timeOne = '' }, - disabledDate: (time) => { + disabledDate: time => { if (this.timeOne) { const WEEK = 3 * 24 * 3600 * 1000 - 1 // ������������3���������1��������� ������3��������� const minTime = this.timeOne // ������������ @@ -539,9 +485,8 @@ } else { return time.getTime() > new Date() } - }, + } }, -<<<<<<< HEAD timeOne: '', threeOptions: { onPick: ({ maxDate, minDate }) => { @@ -550,7 +495,7 @@ // ������������������������������������������������������������ if (maxDate) this.timeOne = '' }, - disabledDate: (time) => { + disabledDate: time => { if (this.timeOne) { const WEEK = 3 * 24 * 3600 * 1000 - 1 // ������������3���������1��������� ������3��������� const minTime = this.timeOne // ������������ @@ -563,10 +508,8 @@ } else { return time.getTime() > new Date() } - }, + } }, -======= ->>>>>>> 5bbcdadbb201985f7bafcc60bd679d9e6f0e4229 sensorDate: null, noneData: false, defaultData: [], @@ -581,7 +524,7 @@ tab3: '115', tab4: '150', tab5: '250', - tab6: '350', + tab6: '350' }, { sensorName: 'PM10', @@ -591,37 +534,37 @@ tab3: '250', tab4: '350', tab5: '420', - tab6: '500', + tab6: '500' }, { sensorName: 'SO2', unit: 'ug/m��', - tab1: '50', - tab2: '150', - tab3: '475', + tab1: '150', + tab2: '500', + tab3: '650', tab4: '800', - tab5: '1600', - tab6: '2100', + tab5: '', + tab6: '' }, { sensorName: 'NO2', unit: 'ug/m��', - tab1: '40', - tab2: '80', - tab3: '180', - tab4: '280', - tab5: '565', - tab6: '750', + tab1: '100', + tab2: '200', + tab3: '700', + tab4: '1200', + tab5: '2340', + tab6: '3090' }, { sensorName: 'CO', unit: 'mg/m��', - tab1: '2', - tab2: '4', - tab3: '14', - tab4: '24', - tab5: '36', - tab6: '48', + tab1: '5', + tab2: '10', + tab3: '35', + tab4: '60', + tab5: '90', + tab6: '120' }, { sensorName: 'O3', @@ -631,7 +574,7 @@ tab3: '300', tab4: '400', tab5: '800', - tab6: '1000', + tab6: '1000' }, { sensorName: 'TVOC', @@ -641,7 +584,7 @@ tab3: '0.5', tab4: '0.7', tab5: '0.9', - tab6: '1', + tab6: '1' }, { sensorName: '���������', @@ -651,8 +594,8 @@ tab3: '1000', tab4: '10000', tab5: '20000', - tab6: '50000', - }, + tab6: '50000' + } ], carWs: null, map: null, @@ -672,12 +615,12 @@ dataTypeList: [ { value: 'history', - label: '������������', + label: '������������' }, { value: 'webSocket', - label: '������������', - }, + label: '������������' + } ], dataTypeValue: 'history', historyView: true, @@ -691,13 +634,14 @@ endTime: '', dataDate: '', sensorTime: [], + Lu: [], startL: '', Lname: '', endL: '', timeValue: [ new Date(2020, 1, 1, 0, 0, 0), - new Date(2022, 12, 31, 23, 59, 59), - ], + new Date(2022, 12, 31, 23, 59, 59) + ] } }, watch: { @@ -721,7 +665,7 @@ // console.log(n) }, deep: true, - immediate: true, + immediate: true // timeValue: { // handler(newVal, oldVal) { // this.sensorTime = this.newTime() @@ -765,55 +709,86 @@ // console.log(file, fileList) }, handleChange(file, fileList) { - this.file = file - console.log(this.file.raw) - this.fileList = fileList + var str = file.name //���������4��� + let a = str.substring(str.length - 3) + // console.log(a) + if (a === 'png') { + this.file = file.raw + console.log(this.file.raw) + this.fileList = fileList + } else { + this.$message('���������png���������������') + } + // console.log(file.name, 'file') }, insLuDuan() { - if (this.startL == '') { - this.$message({ - message: '���������������������', - type: 'warning', - }) - return false - } else if (this.endL == '') { - this.$message({ - message: '���������������������', - type: 'warning', - }) - return false - } else if (this.Lname == '') { + // if (this.startL == '') { + // this.$message({ + // message: '���������������������', + // type: 'warning', + // }) + // return false + // } else if (this.endL == '') { + // this.$message({ + // message: '���������������������', + // type: 'warning', + // }) + // return false + // } else + if (this.Lname == '') { this.$message({ message: '������������������', - type: 'warning', + type: 'warning' }) return false } + if (this.tableData.length === 0) { + this.$message({ + message: '���������������', + type: 'warning' + }) + // console.log(1); + return false + } + // console.log(this.tableData); var times = this.newTime2(this.dateValue) const formData = new FormData() - formData.append(`time1`, this.startL) - formData.append(`time2`, this.endL) + let pv = JSON.stringify(this.tableData) + // let big = { + // table: pv, + // road: this.Lname, + // time3: times[0], + // time4: times[1], + // mac: this.carMac, + // files: this.file, + // } + // console.log(big) + + // console.log(pv); + // formData.append(`time1`, this.startL) + // formData.append(`time2`, this.endL) + + formData.append(`table`, pv) formData.append(`road`, this.Lname) formData.append(`time3`, times[0]) formData.append(`time4`, times[1]) formData.append(`mac`, this.carMac) - this.fileList.map((v) => { + this.fileList.map(v => { formData.append(`files`, v.raw) }) this.$request({ url: 'cruiser/getDailyDustld', method: 'post', headers: { 'Content-Type': 'multipart/form-data' }, // ��������������������������������� - data: formData, - }).then((res) => { + data: formData + }).then(res => { console.log(res) if (res.code === 0) { this.$message({ message: '������������������', - type: 'success', + type: 'success' }) - this.startL = '' - this.endL = '' + this.tableData = [] this.Lname = '' } }) @@ -828,14 +803,15 @@ this.qnull() }, qnull() { - this.startL = '' - this.endL = '' + // this.startL = '' + // this.endL = '' + this.tableData = [] this.Lname = '' }, // ������������������ newTime2(timeArr) { var arr = [] - timeArr.map((v) => { + timeArr.map(v => { var date = new Date(v) var y = date.getFullYear() var m = date.getMonth() + 1 @@ -868,16 +844,16 @@ device: items, macName: mac, indexs: indexs, - items: [items.latitude, items.longitude], + items: [items.latitude, items.longitude] }, query: { monitorPointInfo: JSON.stringify(item), - device: items, + device: JSON.stringify(items), macName: mac, indexs: indexs, items: [items.latitude, items.longitude], - equipment: 'car', - }, + equipment: 'car' + } }) }, // 6��������������� @@ -894,13 +870,13 @@ getCarData() { this.$request({ url: '/cruiser/selectCruisers', - method: 'get', + method: 'get' }) - .then((res) => { + .then(res => { this.defaultData = res.data this.carMac = res.data[0].mac }) - .catch((err) => { + .catch(err => { console.log(err) }) }, @@ -911,21 +887,21 @@ url: '/cruiser/getDates', method: 'get', params: { - mac: this.carMac, - }, + mac: this.carMac + } }) - .then((res) => { + .then(res => { for (let i = 0; i < res.data.length; i++) { // this.isDataList[i].value = res.data.data[i] // this.isDataList[i].label = res.data.data[i] // this.isDataList[i] = { value: res.data.data[i], label: res.data.data[i] } this.isDataList.push({ value: res.data[i], - label: res.data[i], + label: res.data[i] }) } }) - .catch((err) => { + .catch(err => { console.log(err) }) }, @@ -969,7 +945,7 @@ let str = '' let str2 = '' this.sensorTime = [] - timeArr.map((v) => { + timeArr.map(v => { v = JSON.stringify(v) str2 = v.substr(12, 8).split(':') str2[0] = @@ -1087,15 +1063,18 @@ } this.$request({ - url: '/cruiser/cruiserTrajectory', + // url: '/cruiser/cruiserTrajectory', + url: '/cruiser/carTrajectoryNewAvg', method: 'get', params: { mac: this.carMac, time1: this.sensorDate[0], time2: this.sensorDate[1], - }, - }).then((res) => { - console.log(res) + type: this.sensorKey, + range: this.inputnum + } + }).then(res => { + // console.log(res) if (!res.data.length) { this.noneData = true this.loading = false @@ -1108,6 +1087,7 @@ }, // ������������������������ initStart(res) { + // console.log(res.data, 'res.data') this.abc += 1 const that = this if (!res) { @@ -1126,14 +1106,20 @@ if (this.responseJSON.length > 0) { this.noneData = false $.each(this.responseJSON, (item, value) => { + // console.log(value, 'value') if (typeof value.flylon === 'undefined') { showNoPoints() } else { + // console.log(value.flylon.toString().length, 'value.flylon.length') var lng = parseFloat( - value.flylon.substr(0, value.flylon.length - 1) + value.flylon + .toString() + .substr(0, value.flylon.toString().length - 1) ) var lat = parseFloat( - value.flylat.substr(0, value.flylat.length - 1) + value.flylat + .toString() + .substr(0, value.flylat.toString().length - 1) ) if (lng < 70 || lng > 150 || lat > 60 || lat < 20) { return true @@ -1148,7 +1134,6 @@ timeArrSub[i] = v.split(' ')[0] if (i === 1) timeArrSub[2] = v.split(' ')[1] }) -<<<<<<< HEAD if ( that.carMac === 'p5dnd7a0243626' && timeArrSub[0] === '2022-12-11' && @@ -1156,36 +1141,25 @@ (timeArrSub[1] === '2022-12-12' && timeArrSub[2] === '00:00:00')) ) { -======= - if (that.carMac === 'p5dnd7a0243626' && timeArrSub[0] === '2022-12-11' && (timeArrSub[1] === '2022-12-11' || timeArrSub[1] === '2022-12-12' && timeArrSub[2] === '00:00:00')) { ->>>>>>> 5bbcdadbb201985f7bafcc60bd679d9e6f0e4229 if (value.a34004) point.a34004 = parseInt(value.a34004 * 2.7) if (value.a34002) point.a34002 = parseInt(value.a34002 * 2.2) if (value.a21026) point.a21026 = parseInt(value.a21026 - 0 + 5) if (value.a21004) point.a21004 = parseInt(value.a21004 - 20) // point.a21004 = parseInt(value.a21004) -<<<<<<< HEAD if (value.a21005) point.a21005 = parseFloat(value.a21005 - 0 + 0.85).toFixed(3) -======= - if (value.a21005) point.a21005 = parseFloat(value.a21005 - 0 + 0.85).toFixed(3) ->>>>>>> 5bbcdadbb201985f7bafcc60bd679d9e6f0e4229 if (value.a05024 < 15) { point.a05024 = parseInt(value.a05024 + 3) } else if (value.a05024 > 18) { point.a05024 = parseInt(value.a05024 - 3) } else point.a05024 = parseInt(value.a05024) point.a99054 = parseFloat(value.a99054).toFixed(3) -<<<<<<< HEAD if ( value.dustld - 0 !== 0 && value.dustld - 0 < 100 && (that.carMac === 'p5dnd7a0243622' || that.carMac === 'p5dnd7a0243625') ) { -======= - if (value.dustld - 0 !== 0 && value.dustld - 0 < 100 && (that.carMac === 'p5dnd7a0243622' || that.carMac === 'p5dnd7a0243625')) { ->>>>>>> 5bbcdadbb201985f7bafcc60bd679d9e6f0e4229 point.dustld = 100 } else { point.dustld = value.dustld - 0 @@ -1198,37 +1172,22 @@ point.a21005 = parseFloat(value.a21005).toFixed(3) point.a05024 = parseInt(value.a05024) point.a99054 = parseFloat(value.a99054).toFixed(3) -<<<<<<< HEAD - if ( - value.dustld - 0 !== 0 && - value.dustld - 0 < 100 && - (that.carMac === 'p5dnd7a0243622' || - that.carMac === 'p5dnd7a0243625') - ) { -======= - if (value.dustld - 0 !== 0 && value.dustld - 0 < 100 && (that.carMac === 'p5dnd7a0243622' || that.carMac === 'p5dnd7a0243625')) { ->>>>>>> 5bbcdadbb201985f7bafcc60bd679d9e6f0e4229 - point.dustld = 100 + if (value.dustld - 0 >= 0 && value.dustld - 0 < 40) { + point.dustld = value.dustld - 0 // + 170 + } else if (value.dustld - 0 >= 40 && value.dustld - 0 < 60) { + point.dustld = value.dustld - 0 // + 130 + } else if (value.dustld - 0 >= 60 && value.dustld - 0 < 100) { + point.dustld = value.dustld - 0 // + 110 + } else if (value.dustld - 0 >= 100 && value.dustld - 0 < 150) { + point.dustld = value.dustld - 0 // + 70 + } else if (value.dustld - 0 >= 150 && value.dustld - 0 < 180) { + point.dustld = value.dustld - 0 // + 30 } else { point.dustld = value.dustld - 0 } } -<<<<<<< HEAD -======= - // point.a34004 = parseInt(value.a34004) - // point.a34002 = parseInt(value.a34002) - // point.a21026 = parseInt(value.a21026) - // point.a21004 = parseInt(value.a21004) - // point.a21005 = parseFloat(value.a21005).toFixed(3) - // point.a05024 = parseInt(value.a05024) - // point.a99054 = parseFloat(value.a99054).toFixed(3) - // if (value.dustld - 0 !== 0 && value.dustld - 0 < 100 && (that.carMac === 'p5dnd7a0243622' || that.carMac === 'p5dnd7a0243625')) { - // point.dustld = 100 - // } else { - // point.dustld = value.dustld - 0 - // } // point.dustld = value.dustld - 0 ->>>>>>> 5bbcdadbb201985f7bafcc60bd679d9e6f0e4229 + point.times = value.time trackPoints.push(point) } }) @@ -1251,7 +1210,7 @@ // ������������������ skyColors: ['rgba(186, 0, 255, 0)', 'rgba(186, 0, 255, 0.2)'], // ������������ building: false, // ������������������ - poiText: true, // ������poi������ + poiText: true // ������poi������ }) that.map.addControl(new BMapGL.NavigationControl3D()) // ������3d������ if (this.responseJSON.length === 0) { @@ -1264,7 +1223,7 @@ if (that.firstPlayFlag) { that.map.centerAndZoom(that.centerPoint, that.mapZoom) that.view = new mapvgl.View({ - map: that.map, + map: that.map }) that.firstPlayFlag = false } else { @@ -1291,13 +1250,7 @@ selectedColor: '#ee1111', // ��������������� autoSelect: true, // ������������������������������������������ riseTime: 1800, // ��������������������������� -<<<<<<< HEAD - onClick: (e) => {}, -======= - onClick: (e) => { - // console.log(e) - }, ->>>>>>> 5bbcdadbb201985f7bafcc60bd679d9e6f0e4229 + onClick: e => {} }) that.shapeLayer.setData(data) that.view.addLayer(that.shapeLayer) @@ -1324,7 +1277,7 @@ new BMapGL.Point(sw.lng, sw.lat), // ��������� new BMapGL.Point(ne.lng, sw.lat), // ��������� new BMapGL.Point(ne.lng, ne.lat), // ��������� - new BMapGL.Point(sw.lng, ne.lat), // ��������� + new BMapGL.Point(sw.lng, ne.lat) // ��������� ], { strokeWeight: 0.5, strokeOpacity: 0.0, fillColor: color } ) @@ -1342,7 +1295,7 @@ ) var startMark = new BMapGL.Marker(that.showPoints[0], { icon: startIcon, - offset: new BMapGL.Size(0, -20), + offset: new BMapGL.Size(0, -20) }) that.map.addOverlay(startMark) var endIcon = new BMapGL.Icon( @@ -1353,7 +1306,7 @@ that.showPoints[that.showPoints.length - 1], { icon: endIcon, - offset: new BMapGL.Size(0, -20), + offset: new BMapGL.Size(0, -20) } ) that.map.addOverlay(endMark) @@ -1371,8 +1324,8 @@ data.push({ geometry: { type: '"LineString"', - coordinates: [points], - }, + coordinates: [points] + } }) var lineLayer = new mapvgl.LineLayer({ color: 'red', @@ -1380,7 +1333,7 @@ animation: true, duration: 10, // ������������2s trailLength: 0.1, // ������������������������0.4 - interval: 0.3, // ���������������������������������0.2 + interval: 0.3 // ���������������������������������0.2 }) that.view.addLayer(lineLayer) lineLayer.setData(data) @@ -1391,18 +1344,21 @@ var points = [] points.push(trackPoints[0]) for (var i = 1; i < trackPoints.length; i++) { - var flag = true + // var flag = true var point1 = trackPoints[i] - for (var j = 0; j < points.length; j++) { - var point2 = points[j] - var dis = that.map.getDistance(point1, point2) // ������������������������������������������������ - if (dis < size) { - flag = false - } - } - if (flag) { - points.push(point1) - } + // for (var j = 0; j < points.length; j++) { + // var point2 = points[j] + // var dis = that.map.getDistance(point1, point2) // ������������������������������������������������ + // if (dis < size) { + // flag = false + // } + // } + // points.push(point1) + // console.log(points,'num'); + // if (flag) { + points.push(point1) + // console.log(points, 'num') + // } } return points @@ -1430,11 +1386,7 @@ // ���������������10��������������� lng = (lng * 180) / Math.PI lat = (lat * 180) / Math.PI -<<<<<<< HEAD // console.log(lng, lat,123) -======= - // console.log(lng, lat) ->>>>>>> 5bbcdadbb201985f7bafcc60bd679d9e6f0e4229 return new BMapGL.Point(lng, lat) } @@ -1501,77 +1453,77 @@ data0.push({ geometry: { type: 'Polygon', - coordinates: [polygon], + coordinates: [polygon] }, properties: { - height: height, - }, + height: height + } }) break case 1: data1.push({ geometry: { type: 'Polygon', - coordinates: [polygon], + coordinates: [polygon] }, properties: { - height: height, - }, + height: height + } }) break case 2: data2.push({ geometry: { type: 'Polygon', - coordinates: [polygon], + coordinates: [polygon] }, properties: { - height: height, - }, + height: height + } }) break case 3: data3.push({ geometry: { type: 'Polygon', - coordinates: [polygon], + coordinates: [polygon] }, properties: { - height: height, - }, + height: height + } }) break case 4: data4.push({ geometry: { type: 'Polygon', - coordinates: [polygon], + coordinates: [polygon] }, properties: { - height: height, - }, + height: height + } }) break case 5: data5.push({ geometry: { type: 'Polygon', - coordinates: [polygon], + coordinates: [polygon] }, properties: { - height: height, - }, + height: height + } }) break case 6: data6.push({ geometry: { type: 'Polygon', - coordinates: [polygon], + coordinates: [polygon] }, properties: { - height: height, - }, + height: height + } }) break } @@ -1772,7 +1724,7 @@ `<span class="my-maptip" data-times="${point.times}">${content}<span>`, // ���lable������������ { offset: new BMapGL.Size(-8, -10), // label������������������������label������������������������ - position: point, + position: point } ) // label��������� @@ -1790,28 +1742,53 @@ lineHeight: '20px', fontFamily: '������������', backgroundColor: '0.05', - fontWeight: 'bold', + fontWeight: 'bold' } -<<<<<<< HEAD - label.addEventListener('click', (e) => { - console.log(e) + label.addEventListener('click', e => { + // console.log(e) // var ps = e.target.latLng.lat // var ps1 = e.target.latLng.lng // var p1 = new BMap.Point(ps1, ps); // var marker = new BMap.Marker(p1);; // that.map.addOverlay(marker); var times = e.target.domElement.children[0].getAttribute('data-times') - console.log(times) + // console.log(times) if (that.startL == '') { that.startL = times + // that.Lu.startLu.push(that.startL) + // console.log(that.Lu.startLu, 'start') } else { + // that.tableData=[] that.endL = times + comparedate(that.startL, that.endL) + // var endLu = [] + // that.Lu.endLu.push(that.endL) + // console.log(that.Lu.endLu, 'end') + // that.startL = '' + // that.endL = '' + // that.tableData.push(that.Lu) + // console.log(that.tableData, 'table') } }) -======= ->>>>>>> 5bbcdadbb201985f7bafcc60bd679d9e6f0e4229 label.setStyle(labelStyle) that.map.addOverlay(label) + } + //��������������������������� + function comparedate(date1, date2) { + let oDate1 = new Date(date1) + let oDate2 = new Date(date2) + if (oDate1.getTime() > oDate2.getTime()) { + that.startL = '' + that.endL = '' + that.$message('���������������������������������������������������') + return false + } else if (oDate1.getTime() < oDate2.getTime()) { + var cardNumObj = { start: that.startL, end: that.endL } + that.tableData.push(cardNumObj) + console.log(that.tableData, 'that.tableData') + that.startL = '' + that.endL = '' + } } // ������������,������������������ @@ -1901,7 +1878,10 @@ // this.bg = require('@/assets/images/tl_TVOCNew.png') break } - this.initStart(this.carData) + this.$nextTick(() => { + this.getStart() + }) + this.initStart() }, changeCode1(index) { this.changeColor1 = index @@ -1911,8 +1891,8 @@ this.viewKey = '3D' } this.getStart() - }, - }, + } + } } </script> <style lang="less" scoped> @@ -2095,7 +2075,7 @@ border: 1px solid white; background-color: white; width: 20rem; - height: 23rem; + height: 30rem; position: absolute; top: 3rem; left: 1rem; @@ -2110,4 +2090,7 @@ .insLu div { margin-top: 0.8rem; } +/deep/.inputNum { + width: 5% !important; +} </style> -- Gitblit v1.8.0