| | |
| | | <el-container style="height: 100%"> |
| | | <el-aside |
| | | width="300px" |
| | | style="background-color: rgb(238, 241, 246); overflow-y: hidden" |
| | | style="background-color: rgb(238, 241, 246); overflow: hidden" |
| | | > |
| | | <div style="width: 274px; margin: 13px auto"> |
| | | <el-date-picker |
| | |
| | | ref="datePick" |
| | | v-model="datenum" |
| | | @change="chooseDate" |
| | | @blur="chooseDate1" |
| | | @focus="chooseDate2" |
| | | value-format="yyyy-MM-dd" |
| | | style="width: 280px" |
| | | > |
| | | </el-date-picker> |
| | | </div> |
| | | |
| | | <!-- <el-card class="box-card" style="width: 274px; margin: 13px auto"> --> |
| | | |
| | | <!-- <div v-else style="height: 180px; width: 274px; overflow-x: hidden"> |
| | |
| | | </div> --> |
| | | <!-- </el-card> --> |
| | | |
| | | <div style="width: 274px; margin: 350px auto; border-radius: 8px"> |
| | | <div |
| | | style="width: 274px; margin: 10px auto; border-radius: 8px" |
| | | class="coll" |
| | | > |
| | | <!--accordion 手风琴模式--> |
| | | <el-collapse |
| | | accordion |
| | | style="box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1)" |
| | | v-show="shou1 === true" |
| | | v-loading="loading" |
| | | > |
| | | <el-collapse-item |
| | | style="text-indent: 2em; position: relative; padding-botton: 10px" |
| | | > |
| | | <template slot="title"> |
| | | <img |
| | | style="position: absolute; left: 18px" |
| | | src="../../assets/images/uav/uav.png" |
| | | /> |
| | | <span |
| | | style="display: inline-block; position: absolute; left: 20px" |
| | | > |
| | | 该日期暂无无人机数据</span |
| | | > |
| | | </template> |
| | | </el-collapse-item> |
| | | </el-collapse> |
| | | <el-collapse |
| | | v-model="asideData.activeNames" |
| | | accordion |
| | | style="box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1)" |
| | | @change="handleChange" |
| | | ref="collapse" |
| | | v-show="shou1 === false" |
| | | v-loading="loading" |
| | | > |
| | | <el-collapse-item |
| | | v-for="(item1, index) in asideData.uavTimeFly" |
| | | :key="index" |
| | | :name="index" |
| | | style="text-indent: 2em; position: relative" |
| | | style="text-indent: 2em; position: relative; padding-botton: 10px" |
| | | > |
| | | <template slot="title"> |
| | | <img |
| | |
| | | v-for="(item, index) in item1.timeSlot" |
| | | :key="index" |
| | | class="per-date_area" |
| | | :class="{ activeArea: asideData.activeAreaKey === index }" |
| | | :class="{ activeArea: asideData.activeKey === index }" |
| | | @click="getFlyData(item, index, item1.mac)" |
| | | > |
| | | <div style="width: 100%; margin: 0 auto"> |
| | |
| | | <span>{{ |
| | | item.endTime.substr(11, item.startTime.length) |
| | | }}</span> |
| | | <span> ({{ item.total }}条) </span> |
| | | </div> |
| | | </div> |
| | | </el-scrollbar> |
| | |
| | | v-model="radioSeven" |
| | | size="medium" |
| | | @change="changeCode" |
| | | v-if="selecttrue === 1" |
| | | style="margin-top: 10px; margin-left: 10px" |
| | | > |
| | | <el-radio-button label="PM2.5"></el-radio-button> |
| | | <el-radio-button label="PM10"></el-radio-button> |
| | |
| | | <el-radio-button label="03"></el-radio-button> |
| | | <el-radio-button label="TVOC"></el-radio-button> |
| | | </el-radio-group> |
| | | <!-- <el-input |
| | | placeholder="请输入内容" |
| | | v-model="uvasize" |
| | | class="inputNum" |
| | | clearable |
| | | > |
| | | </el-input> --> |
| | | <div class="Duo" v-if="selecttrue === 2"> |
| | | <div class="spantuu"> |
| | | <span>无人机飞行高度范围(米): </span> |
| | | <el-input |
| | | class="inputtu" |
| | | v-model="tallone" |
| | | ref="uvas" |
| | | ></el-input> |
| | | -- |
| | | <el-input |
| | | class="inputtu" |
| | | v-model="talltwo" |
| | | ref="uvas" |
| | | ></el-input> |
| | | </div> |
| | | <!-- <el-select v-model="Duovalue" placeholder="其他因子" class="slee"> |
| | | <el-option |
| | | v-for="item in optionsduo" |
| | | :key="item.code" |
| | | :label="item.name" |
| | | :value="item.name" |
| | | > |
| | | </el-option> |
| | | </el-select> --> |
| | | <div class="spantu"> |
| | | <span>图形边长(米): </span |
| | | ><el-input |
| | | class="inputtu" |
| | | v-model="uvasize" |
| | | clearable |
| | | placeholder="请输入内容" |
| | | ref="uvas" |
| | | ></el-input> |
| | | </div> |
| | | <el-select v-model="Duovalue" placeholder="其他因子" class="slee"> |
| | | <el-option |
| | | v-for="item in optionsduo" |
| | | :key="item.code" |
| | | :label="item.name" |
| | | :value="item.name" |
| | | > |
| | | </el-option> |
| | | </el-select> |
| | | <!-- <div class="spantuu"> |
| | | <span>无人机飞行高度范围(米): </span> |
| | | <el-input |
| | | class="inputtu" |
| | | v-model="tallone" |
| | | ref="uvas" |
| | | ></el-input> |
| | | -- |
| | | <el-input |
| | | class="inputtu" |
| | | v-model="talltwo" |
| | | ref="uvas" |
| | | ></el-input> |
| | | </div> --> |
| | | </div> |
| | | <div v-if="selecttrue === 1" style="margin-left: 10px"> |
| | | <el-button type="primary" @click="gengD" class="gengD" |
| | | <el-button type="primary" @click="gengD" style="margin-top: 10px" |
| | | >更多条件</el-button |
| | | > |
| | | </div> |
| | | <div v-if="selecttrue === 2" style="margin-left: 10px"> |
| | | <div |
| | | v-if="selecttrue === 2" |
| | | style="margin-left: 10px; margin-top: 10px" |
| | | > |
| | | <el-button |
| | | size="medium" |
| | | type="primary" |
| | | icon="el-icon-setting" |
| | | @click="dialogFormVisible = true" |
| | | >6参设定</el-button |
| | | > |
| | | <el-button class="gengD" @click="shou">收起</el-button> |
| | | <el-button type="primary" @click="selectDuo">查询</el-button> |
| | | </div> |
| | | </div> |
| | | <div class="Duo" v-if="selecttrue === 2"> |
| | | <!-- <div class="Duo" v-if="selecttrue === 2"> |
| | | <el-select v-model="Duovalue" placeholder="其他因子" class="slee"> |
| | | <el-option |
| | | v-for="item in optionsduo" |
| | |
| | | </el-option> |
| | | </el-select> |
| | | <div class="spantu"> |
| | | <span>图形边长(米):</span |
| | | <span>图形边长(米): </span |
| | | ><el-input |
| | | class="inputtu" |
| | | v-model="uvasize" |
| | |
| | | ></el-input> |
| | | </div> |
| | | <div class="spantuu"> |
| | | <span>无人机飞行高度范围(米):</span> |
| | | <el-input class="inputtu" v-model="tallone" ref="uvas"></el-input |
| | | >- |
| | | <span>无人机飞行高度范围(米): </span> |
| | | <el-input class="inputtu" v-model="tallone" ref="uvas"></el-input> |
| | | -- |
| | | <el-input class="inputtu" v-model="talltwo" ref="uvas"></el-input> |
| | | </div> |
| | | </div> |
| | | </div> --> |
| | | </div> |
| | | <div v-if="noneData" class="noneData">当前时间没有飞行数据</div> |
| | | <div id="map_container" v-loading="loading" /> |
| | | <!-- <div v-if="noneData" class="noneData">当前时间没有飞行数据</div> --> |
| | | <div id="map_container" v-loading="loading1" /> |
| | | </el-main> |
| | | </el-container> |
| | | <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="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> |
| | | <el-descriptions-item label="CO | mg/m³">0.5</el-descriptions-item> |
| | | <el-descriptions-item label="O3 | ug/m³">149</el-descriptions-item> |
| | | </el-descriptions> |
| | | <!-- <el-descriptions title="设备标准值" border> |
| | | </el-descriptions> --> |
| | | <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> |
| | | <el-table-column prop="sensorName" label="名称" /> |
| | | <el-table-column prop="unit" label="单位" /> |
| | | <el-table-column label="一级"> |
| | | <template slot-scope="scope"> |
| | | <el-input v-model="scope.row.tab1" placeholder="请输入内容" /> |
| | | <!-- <span v-show="!scope.row.show">{{ scope.row.tab1 }}</span> --> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="二级"> |
| | | <template slot-scope="scope"> |
| | | <el-input v-model="scope.row.tab2" placeholder="请输入内容" /> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="三级"> |
| | | <template slot-scope="scope"> |
| | | <el-input v-model="scope.row.tab3" placeholder="请输入内容" /> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="四级"> |
| | | <template slot-scope="scope"> |
| | | <el-input v-model="scope.row.tab4" placeholder="请输入内容" /> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="五级"> |
| | | <template slot-scope="scope"> |
| | | <el-input v-model="scope.row.tab5" placeholder="请输入内容" /> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="六级"> |
| | | <template slot-scope="scope"> |
| | | <el-input v-model="scope.row.tab6" placeholder="请输入内容" /> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <div slot="footer" class="dialog-footer"> |
| | | <el-button @click="dialogFormVisible = false">取 消</el-button> |
| | | <el-button type="primary" @click="customLevel">确 定</el-button> |
| | | </div> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | |
| | | }, |
| | | data() { |
| | | return { |
| | | dialogFormVisible: false, |
| | | chosee: 1, |
| | | shou1: true, |
| | | zhanK1: 1, |
| | | zhanK: 1, |
| | | Duovalue: '', |
| | | datenum: '', |
| | | datenum: new Date(), |
| | | // orderTime:[Date('2020-06-19'),Date('2021-06-19')] |
| | | selecttrue: 1, |
| | | pickerOptions: { |
| | | cellClassName: (time) => { |
| | |
| | | }, |
| | | |
| | | tallone: 0, |
| | | talltwo: 500, |
| | | talltwo: 120, |
| | | // 侧边栏数据 |
| | | asideData: { |
| | | dates: [], // 存放date数组 |
| | | activeNames: [0], |
| | | uavTimeFly: [], // 存放无人机信息以及飞行时间区间 |
| | | activeKey: 0, |
| | | activeKey: -1, |
| | | activeAreaKey: 0, |
| | | }, |
| | | load: 1, |
| | |
| | | bdLon: null, |
| | | bdLat: null, |
| | | loading: false, |
| | | loading1: false, |
| | | snesorParams: [ |
| | | 'PM2.5', |
| | | 'PM10', |
| | |
| | | noneData: true, |
| | | defaultData: [], |
| | | carMac: null, |
| | | dialogFormVisible: false, |
| | | optionsduo: [ |
| | | { code: 'a34004', name: 'PM2.5' }, |
| | | { code: 'a34002', name: 'PM10' }, |
| | |
| | | endTime: '', |
| | | dataDate: '', |
| | | sensorTime: [], |
| | | uvasize: 50, |
| | | uvasize: 20, |
| | | timeValue: [ |
| | | new Date(2020, 1, 1, 0, 0, 0), |
| | | new Date(2022, 12, 31, 23, 59, 59), |
| | |
| | | timeNums: [], |
| | | batchs: '', |
| | | macs: '', |
| | | sensorTableData: [ |
| | | { |
| | | sensorName: 'PM2.5', |
| | | unit: 'ug/m³', |
| | | tab1: '35', |
| | | tab2: '75', |
| | | tab3: '115', |
| | | tab4: '150', |
| | | tab5: '250', |
| | | tab6: '350', |
| | | }, |
| | | { |
| | | sensorName: 'PM10', |
| | | unit: 'ug/m³', |
| | | tab1: '50', |
| | | tab2: '150', |
| | | tab3: '250', |
| | | tab4: '350', |
| | | tab5: '420', |
| | | tab6: '500', |
| | | }, |
| | | { |
| | | sensorName: 'SO2', |
| | | unit: 'ug/m³', |
| | | tab1: '150', |
| | | tab2: '500', |
| | | tab3: '650', |
| | | tab4: '800', |
| | | tab5: '', |
| | | tab6: '', |
| | | }, |
| | | { |
| | | sensorName: 'NO2', |
| | | unit: 'ug/m³', |
| | | tab1: '100', |
| | | tab2: '200', |
| | | tab3: '700', |
| | | tab4: '1200', |
| | | tab5: '2340', |
| | | tab6: '3090', |
| | | }, |
| | | { |
| | | sensorName: 'CO', |
| | | unit: 'mg/m³', |
| | | tab1: '5', |
| | | tab2: '10', |
| | | tab3: '35', |
| | | tab4: '60', |
| | | tab5: '90', |
| | | tab6: '120', |
| | | }, |
| | | { |
| | | sensorName: 'O3', |
| | | unit: 'ug/m³', |
| | | tab1: '160', |
| | | tab2: '200', |
| | | tab3: '300', |
| | | tab4: '400', |
| | | tab5: '800', |
| | | tab6: '1000', |
| | | }, |
| | | { |
| | | sensorName: 'TVOC', |
| | | unit: 'mg/m³', |
| | | tab1: '0.1', |
| | | tab2: '0.3', |
| | | tab3: '0.5', |
| | | tab4: '0.7', |
| | | tab5: '0.9', |
| | | tab6: '1', |
| | | }, |
| | | { |
| | | sensorName: '尘负荷', |
| | | unit: 'ug/m³', |
| | | tab1: '300', |
| | | tab2: '500', |
| | | tab3: '1000', |
| | | tab4: '10000', |
| | | tab5: '20000', |
| | | tab6: '50000', |
| | | }, |
| | | ], |
| | | } |
| | | }, |
| | | |
| | | mounted() { |
| | | this.$refs.datePick.focus() |
| | | this.initStart() |
| | | // this.$refs.datePick.focus() |
| | | // this.getDate() |
| | | // this.flyData() |
| | | }, |
| | |
| | | this.newTime(this.timeValue) |
| | | this.newDate() |
| | | this.getDate() |
| | | |
| | | // this.getFlyData() |
| | | }, |
| | | methods: { |
| | | customLevel() { |
| | | this.selectDuo() |
| | | this.dialogFormVisible = false |
| | | }, |
| | | selectDuo() { |
| | | // console.log(2115); |
| | | if (this.chosee === 1) { |
| | | this.$message.warning('请先在左侧选择无人机时间') |
| | | return |
| | | } else { |
| | | // console.log('132123'); |
| | | this.loading1 = true |
| | | } |
| | | if (this.view) { |
| | | this.view.removeAllLayers() |
| | | this.map.clearOverlays() |
| | | } |
| | | this.$request({ |
| | | // url: '/uav/queryDataByBatch', |
| | | url: '/uav/test', |
| | | url: '/uav/getUav', |
| | | // url: '/uav/test', |
| | | method: 'post', |
| | | data: { |
| | | batch: this.batchs, |
| | | uvasize: this.uvasize, |
| | | height: 0, |
| | | mac: this.macs, |
| | | height1: this.tallone, |
| | | height2: this.talltwo, |
| | | // batch: '2023-06-16 16:21:21', |
| | | }, |
| | | }).then((res) => { |
| | | console.log(res) |
| | | // console.log(res) |
| | | this.carData = [] |
| | | if (res.data === 'null') { |
| | | this.noneData = true |
| | | this.loading = false |
| | | return |
| | | } |
| | | for (var i = 0; i < res.data.length; i++) { |
| | |
| | | } |
| | | this.changeCode(this.Duovalue) |
| | | this.initStart(this.carData) |
| | | if (res.data.vos.length) { |
| | | this.initStart(this.carData) |
| | | } |
| | | }) |
| | | }, |
| | | chooseDate() { |
| | | this.$refs.datePick.focus() // 选择日期后依旧触发焦点 |
| | | // this.$refs.datePick.focus() // 选择日期后依旧触发焦点 |
| | | this.getTimeAreaData(this.datenum) |
| | | $('.coll').css('margin-top', '350px') |
| | | }, |
| | | // chooseDate1() { |
| | | // this.$refs.datePick.focus() // 选择日期后依旧触发焦点 |
| | | // this.$refs.uvas.focus() |
| | | // }, |
| | | chooseDate2() { |
| | | // this.$refs.datePick.focus() // 选择日期后依旧触发焦点 |
| | | // this.getTimeAreaData(this.datenum) |
| | | $('.coll').css('margin-top', '350px') |
| | | }, |
| | | chooseDate1() { |
| | | $('.coll').css('margin-top', '10px') |
| | | // this.$refs.datePick.focus() // 选择日期后依旧触发焦点 |
| | | }, |
| | | gengD() { |
| | | if (this.zhanK === 1) { |
| | | this.$message.warning('请先在左侧选择无人机和时间') |
| | | return |
| | | } |
| | | // if (this.zhanK === 1) { |
| | | // this.$message.warning('请先在左侧选择无人机和时间') |
| | | // return |
| | | // } |
| | | this.selecttrue = 2 |
| | | $('.dds').css({ height: '150px' }) |
| | | $('.numss').css({ width: '1050px' }) |
| | | }, |
| | | shou() { |
| | | this.selecttrue = 1 |
| | | $('.dds').css({ height: '100px' }) |
| | | $('.numss').css({ width: '700px' }) |
| | | }, |
| | | parseTime(time, cFormat) { |
| | | if (arguments.length === 0 || !time) { |
| | |
| | | }) |
| | | return arr |
| | | }, |
| | | // 点击列表切换走航车数据 |
| | | changeCarData(e) { |
| | | this.carMac = e |
| | | this.getStart() |
| | | }, |
| | | // 请求走航车列表数据 |
| | | // 进行经纬度转换为距离的计算 |
| | | Rad(d) { |
| | | return (d * Math.PI) / 180.0 // 经纬度转换成三角函数中度分表形式。 |
| | |
| | | } |
| | | this.dataType = 'history' |
| | | // this.map = null |
| | | this.getStart() |
| | | } |
| | | }, |
| | | // 获取无人机以及时间区间 |
| | | getTimeAreaData(item) { |
| | | // this.asideData.uavTimeFly = [] |
| | | this.loading = true |
| | | this.$request({ |
| | | url: 'uav/queryTimeSlot', |
| | | method: 'get', |
| | |
| | | date: item, |
| | | }, |
| | | }).then((res) => { |
| | | this.asideData = [] |
| | | console.log(res.data.vos, 'res.data.vos') |
| | | if (res.data.vos.length === 0) { |
| | | // console.log(res, 'res.data.vos') |
| | | if (res.code === -47) { |
| | | this.noneData = true |
| | | this.loading = false |
| | | // this.asideData.uavTimeFly=res.message |
| | | this.shou1 = true |
| | | } else { |
| | | this.shou1 = false |
| | | this.asideData.uavTimeFly = res.data.vos |
| | | } |
| | | this.loading = false |
| | | // if (res.code === 0) { |
| | | // this.asideData.uavTimeFly = res.data.vos |
| | | // } |
| | |
| | | }, |
| | | // 初始化地图 |
| | | getFlyData(item, index, mac) { |
| | | // for (var i = 0; i < this.xie.date.length; i++) { |
| | | // this.xie.date[i].flyLat = this.xie.date[i].flyLat + ' °'.toString() |
| | | // this.xie.date[i].flyLon = this.xie.date[i].flyLon + ' °'.toString() |
| | | // this.xie.date[i].a34004 = this.xie.date[i].a34004 |
| | | // this.carData.push(this.xie.date[i]) |
| | | // } |
| | | // this.initStart(this.carData) |
| | | this.loading1 = true |
| | | this.asideData.activeKey = index |
| | | this.chosee = 2 |
| | | this.batchs = item.batch |
| | | this.macs = mac |
| | | this.noneData = false |
| | |
| | | } |
| | | this.$request({ |
| | | // url: '/uav/queryDataByBatch', |
| | | url: '/uav/test', |
| | | // url: '/uav/test', |
| | | url: '/uav/getUav', |
| | | method: 'post', |
| | | data: { |
| | | batch: item.batch, |
| | | uvasize: this.uvasize, |
| | | height: 0, |
| | | height1: this.tallone, |
| | | height2: this.talltwo, |
| | | mac: mac, |
| | | // batch: '2023-06-16 16:21:21', |
| | | }, |
| | | }).then((res) => { |
| | | console.log(res) |
| | | // console.log(res) |
| | | this.carData = [] |
| | | if (res.data === 'null') { |
| | | this.noneData = true |
| | | this.loading = false |
| | | return |
| | | } |
| | | for (var i = 0; i < res.data.length; i++) { |
| | |
| | | this.asideData.dates = JSON.parse(JSON.stringify(res.data.datesStr)) |
| | | this.timeNums = this.asideData.dates |
| | | if (this.asideData.dates.length > 0) { |
| | | this.getTimeAreaData(this.asideData.dates[0], 0) |
| | | this.datenum = this.asideData.dates[0] |
| | | setTimeout(() => { |
| | | if (this.asideData.uavTimeFly[0].timeSlot) { |
| | | console.log( |
| | | this.asideData.uavTimeFly[0].timeSlot, |
| | | 'this.asideData.uavTimeFly[0].timeSlot' |
| | | ) |
| | | // console.log( |
| | | // this.asideData.uavTimeFly[0].timeSlot, |
| | | // 'this.asideData.uavTimeFly[0].timeSlot[0]' |
| | | // ) |
| | | this.getFlyData(this.asideData.uavTimeFly[0].timeSlot[0], 0, mac) |
| | | } |
| | | }, 500) |
| | | this.getTimeAreaData(this.datenum, 0) |
| | | // this.datenum = this.asideData.dates[0] |
| | | // setTimeout(() => { |
| | | // if (this.asideData.uavTimeFly[0].timeSlot) { |
| | | // console.log( |
| | | // this.asideData.uavTimeFly[0].timeSlot, |
| | | // 'this.asideData.uavTimeFly[0].timeSlot' |
| | | // ) |
| | | // // console.log( |
| | | // // this.asideData.uavTimeFly[0].timeSlot, |
| | | // // 'this.asideData.uavTimeFly[0].timeSlot[0]' |
| | | // // ) |
| | | // this.getFlyData(this.asideData.uavTimeFly[0].timeSlot[0], 0, mac) |
| | | // } |
| | | // }, 500) |
| | | } |
| | | }) |
| | | }, |
| | | initStart(res) { |
| | | console.log(res, 'res') |
| | | this.abc += 1 |
| | | const that = this |
| | | if (!res) { |
| | | return |
| | | } |
| | | if (this.dataType === 'history') { |
| | | this.responseJSON = res |
| | | } else { |
| | | this.responseJSON = res |
| | | } |
| | | // var sensorInfo = this.responseJSON |
| | | // console.log('这是snesor获取得值') |
| | | // console.log(this.responseJSON) |
| | | var trackPoints = [] |
| | | this.loading = false |
| | | if (this.responseJSON.length > 0) { |
| | | this.noneData = false |
| | | $.each(this.responseJSON, (item, value) => { |
| | | if (typeof value.flyLon === 'undefined') { |
| | | showNoPoints() |
| | | } else { |
| | | var lng = parseFloat( |
| | | value.flyLon.substr(0, value.flyLon.length - 1) |
| | | ) |
| | | var lat = parseFloat( |
| | | value.flyLat.substr(0, value.flyLat.length - 1) |
| | | ) |
| | | if (lng < 70 || lng > 150 || lat > 60 || lat < 20) { |
| | | return true |
| | | } |
| | | lng = GPS.gcj_encrypt(lat, lng).lon |
| | | lat = GPS.gcj_encrypt(lat, lng).lat |
| | | lng = GPS.bd_encrypt(lat, lng).lon |
| | | lat = GPS.bd_encrypt(lat, lng).lat |
| | | var point = new BMapGL.Point(lng, lat) |
| | | point.a34004 = parseInt(value.a34004) |
| | | point.a34002 = parseInt(value.a34002) |
| | | point.a21026 = parseInt(value.a21026) |
| | | point.a21004 = parseInt(value.a21004) |
| | | point.a01006 = parseInt(value.a01006) |
| | | point.a01001 = parseInt(value.a01001) |
| | | point.a01002 = parseInt(value.a01002) |
| | | point.a21005 = parseFloat(value.a21005).toFixed(3) |
| | | point.a05024 = parseInt(value.a05024) |
| | | point.a99054 = parseFloat(value.a99054).toFixed(3) |
| | | point.dustld = value.dustld - 0 |
| | | trackPoints.push(point) |
| | | } |
| | | }) |
| | | that.sensor = this.sensorKey |
| | | that.viewType = this.viewKey |
| | | that.size = this.uvasize |
| | | that.distance = that.size / 2 / Math.sin((1 * Math.PI) / 4) |
| | | console.log(that.distance, 'that.distance') |
| | | // 已有地图,避免再次请求 |
| | | if (!that.showPoints) { |
| | | that.map = new BMapGL.Map('map_container') |
| | | } |
| | | that.map.enableScrollWheelZoom(true) // 开启鼠标滚轮,地图可以进行放大、缩小 |
| | | that.map = new BMapGL.Map('map_container') |
| | | that.map.enableScrollWheelZoom(true) // 开启鼠标滚轮,地图可以进行放大、缩小s |
| | | that.map.setMapType(BMAP_EARTH_MAP) // 设置地图类型为地球模式 |
| | | that.map.setDisplayOptions({ |
| | | street: false, // 是否显示路网(只对卫星图和地球模式有效) |
| | | }) |
| | | that.map.setHeading(20) // 设置旋转角度 |
| | | that.map.setHeading(0) // 设置旋转角度 |
| | | if (that.viewKey === '2D') { |
| | | that.map.setTilt(0) // 地图倾斜 |
| | | } else { |
| | | that.map.setTilt(52) |
| | | } |
| | | // 使用百度地图v3.0接口,在设置地图 |
| | | that.map.setMapStyleV2({ |
| | | styleJson: [ |
| | | { |
| | |
| | | }, |
| | | ], |
| | | }) |
| | | showNoPoints() |
| | | this.loading1 = false |
| | | return |
| | | } |
| | | if (this.dataType === 'history') { |
| | | this.responseJSON = res |
| | | } else { |
| | | this.responseJSON = res |
| | | } |
| | | // var sensorInfo = this.responseJSON |
| | | // console.log('这是snesor获取得值') |
| | | // console.log(this.responseJSON) |
| | | var trackPoints = [] |
| | | if (this.responseJSON.length > 0) { |
| | | this.noneData = false |
| | | $.each(this.responseJSON, (item, value) => { |
| | | if (typeof value.flyLon === 'undefined') { |
| | | showNoPoints() |
| | | } else { |
| | | var lng = parseFloat( |
| | | value.flyLon.substr(0, value.flyLon.length - 1) |
| | | ) |
| | | var lat = parseFloat( |
| | | value.flyLat.substr(0, value.flyLat.length - 1) |
| | | ) |
| | | if (lng < 70 || lng > 150 || lat > 60 || lat < 20) { |
| | | return true |
| | | } |
| | | // lng = GPS.gcj_encrypt(lat, lng).lon |
| | | // lat = GPS.gcj_encrypt(lat, lng).lat |
| | | // lng = GPS.bd_encrypt(lat, lng).lon |
| | | // lat = GPS.bd_encrypt(lat, lng).lat |
| | | // lng = GPS.bd_decrypt(lat, lng).lon |
| | | // lat = GPS.bd_decrypt(lat, lng).lat |
| | | var point = new BMapGL.Point(lng, lat) |
| | | point.a34004 = parseInt(value.a34004) |
| | | point.a34002 = parseInt(value.a34002) |
| | | point.a21026 = parseInt(value.a21026) |
| | | point.a21004 = parseInt(value.a21004) |
| | | point.a01006 = parseInt(value.a01006) |
| | | point.a01001 = parseInt(value.a01001) |
| | | point.a01002 = parseInt(value.a01002) |
| | | point.a21005 = parseFloat(value.a21005).toFixed(3) |
| | | point.a05024 = parseInt(value.a05024) |
| | | point.a99054 = parseFloat(value.a99054).toFixed(3) |
| | | point.dustld = value.dustld - 0 |
| | | trackPoints.push(point) |
| | | } |
| | | }) |
| | | that.sensor = this.sensorKey |
| | | that.viewType = this.viewKey |
| | | that.size = this.uvasize |
| | | that.distance = that.size / 2 / Math.sin((1 * Math.PI) / 4) |
| | | // 已有地图,避免再次请求 |
| | | // if (!that.showPoints) { |
| | | // console.log(111) |
| | | // that.map = new BMapGL.Map('map_container') |
| | | // } |
| | | // that.map.enableScrollWheelZoom(true) // 开启鼠标滚轮,地图可以进行放大、缩小s |
| | | // that.map.setMapType(BMAP_EARTH_MAP) // 设置地图类型为地球模式 |
| | | // that.map.setDisplayOptions({ |
| | | // street: false, // 是否显示路网(只对卫星图和地球模式有效) |
| | | // }) |
| | | // that.map.setHeading(20) // 设置旋转角度 |
| | | // if (that.viewKey === '2D') { |
| | | // that.map.setTilt(0) // 地图倾斜 |
| | | // } else { |
| | | // that.map.setTilt(52) |
| | | // } |
| | | // 使用百度地图v3.0接口,在设置地图 |
| | | |
| | | // that.map.setDisplayOptions({ |
| | | // // 设置天空颜色 |
| | |
| | | // console.log(that.mapZoom, 'that.mapZoom') |
| | | that.centerPoint = that.viewport.center |
| | | if (that.firstPlayFlag) { |
| | | console.log(that.mapZoom, that.centerPoint, '1') |
| | | that.map.centerAndZoom(that.centerPoint, that.mapZoom) |
| | | that.view = new mapvgl.View({ |
| | | map: that.map, |
| | | }) |
| | | that.firstPlayFlag = false |
| | | that.loading1 = false |
| | | } else { |
| | | console.log(that.mapZoom, that.centerPoint, '2') |
| | | this.view.removeAllLayers() |
| | | this.map.clearOverlays() |
| | | that.map.centerAndZoom(that.centerPoint, that.mapZoom) |
| | | that.view = new mapvgl.View({ |
| | | map: that.map, |
| | | }) |
| | | that.loading1 = false |
| | | |
| | | // that.map.centerAndZoom(that.centerPoint, 18) |
| | | } |
| | | } |
| | |
| | | } |
| | | } |
| | | points.push(point1) |
| | | // console.log(points, 'image.png') |
| | | // if (flag) { |
| | | // points.push(point1) |
| | | // console.log(points, 'points') |
| | |
| | | } |
| | | this.initStart(this.carData) |
| | | }, |
| | | changeCode1(index) { |
| | | this.changeColor1 = index |
| | | if (index === 0) { |
| | | this.viewKey = '2D' |
| | | } else { |
| | | this.viewKey = '3D' |
| | | } |
| | | this.getStart() |
| | | }, |
| | | }, |
| | | } |
| | | </script> |
| | |
| | | } |
| | | .activeArea { |
| | | background-color: #f5f7fa; |
| | | color: rgb(36, 36, 36); |
| | | } |
| | | /*文本样式*/ |
| | | .textShow { |
| | |
| | | .per-text-data:nth-last-child(1) { |
| | | padding-bottom: 8px; |
| | | } |
| | | .el-collapse { |
| | | border-top: 1px solid #ebeef5; |
| | | border-bottom: 1px solid #ebeef5; |
| | | width: 280px; |
| | | } |
| | | |
| | | /deep/.el-scrollbar__wrap { |
| | | overflow-x: hidden; |
| | | //overflow-y: hidden; |
| | |
| | | background-color: #f40; |
| | | } |
| | | .numss { |
| | | width: 750px; |
| | | width: 700px; |
| | | background-color: white; |
| | | padding: 10px; |
| | | margin-top: 17px; |
| | | display: flex; |
| | | height: 60px; |
| | | } |
| | | /deep/.el-select { |
| | | width: 8% !important; |
| | | } |
| | | .Duo { |
| | | height: 70px; |
| | | display: flex; |
| | | overflow: hidden; |
| | | background-color: white; |
| | | width: 750px; |
| | | padding-left: 10px; |
| | | } |
| | | .spantu { |
| | | width: 190px; |
| | |
| | | // background-color: white; |
| | | // height: 40px; |
| | | display: flex; |
| | | margin-left: 20px; |
| | | line-height: 70px; |
| | | margin-left: 10px; |
| | | line-height: 60px; |
| | | font-weight: 5px; |
| | | |
| | | color: #696b6f; |
| | | .inputtu { |
| | | width: 35%; |
| | | width: 40%; |
| | | margin-left: 5px; |
| | | } |
| | | } |
| | | .slee { |
| | | line-height: 70px; |
| | | line-height: 60px; |
| | | width: 100px; |
| | | margin-left: 25px; |
| | | } |
| | | .spantuu { |
| | | width: 400px; |
| | | line-height: 70px; |
| | | line-height: 60px; |
| | | color: #696b6f; |
| | | .inputtu { |
| | | width: 20%; |
| | | } |
| | |
| | | .jlpMySelectPopper.el-date-picker table { |
| | | width: 88%; |
| | | } |
| | | .BMap_cpyCtrl { |
| | | display: none; |
| | | } |
| | | .anchorBL { |
| | | display: none; |
| | | } |
| | | .el-collapse-item__arrow.is-active { |
| | | -webkit-transform: rotate(90deg); |
| | | transform: rotate(90deg); |
| | | position: absolute; |
| | | top: -3px; |
| | | right: -3px; |
| | | } |
| | | /* 解决自定义滚动条 x 轴显示问题 */ |
| | | .el-scrollbar__wrap { |
| | | overflow-x: hidden; |
| | | } |
| | | </style> |