From 7c9f899e54fe6958815ee52cb46587d91d68493d Mon Sep 17 00:00:00 2001 From: tk Date: Thu, 19 Sep 2024 13:09:43 +0800 Subject: [PATCH] =?UTF-8?q?=E3=80=90=E7=B1=BB=20=20=E5=9E=8B=E3=80=91?= =?UTF-8?q?=EF=BC=9Afactor=20=E7=BB=8F=E5=BA=A6=E5=AD=97=E6=AE=B5=E5=91=BD?= =?UTF-8?q?=E5=90=8D=E6=94=B9=E4=B8=BAlon=20=E3=80=90=E5=8E=9F=20=20?= =?UTF-8?q?=E5=9B=A0=E3=80=91=EF=BC=9A=E5=92=8C=E5=90=8E=E7=AB=AF=20?= =?UTF-8?q?=E7=BB=9F=E4=B8=80=E5=91=BD=E5=90=8D=20=E3=80=90=E8=BF=87=20=20?= =?UTF-8?q?=E7=A8=8B=E3=80=91=EF=BC=9A=20=E3=80=90=E5=BD=B1=20=20=E5=93=8D?= =?UTF-8?q?=E3=80=91=EF=BC=9A?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/BatteryStatus.vue | 6 +- src/components/ControllerTabs.vue | 1 + src/components/MapBox.vue | 84 +++++++++---------- src/store/modules/app.js | 12 +-- .../layout/components/main/home/index.vue | 16 ++-- .../layout/components/main/planes/index.vue | 18 ++-- src/views/layout/index.vue | 12 +-- 7 files changed, 75 insertions(+), 74 deletions(-) diff --git a/src/components/BatteryStatus.vue b/src/components/BatteryStatus.vue index 7bed634..8f86056 100644 --- a/src/components/BatteryStatus.vue +++ b/src/components/BatteryStatus.vue @@ -93,9 +93,9 @@ export default { rtlRemaining () { let rtlTime = 0 // 返航所需时间（秒） if (this.planePosition && this.homePosition && this.wpnavSpeed) { - const planeLngLat = { lat: this.planePosition[1], lon: this.planePosition[0] } - const homeLngLat = { lat: this.homePosition.lat, lon: this.homePosition.lng } - const horizontalDistance = geodist(planeLngLat, homeLngLat, { unit: 'meters' }) // 水平距离 + const planeLonLat = { lat: this.planePosition[1], lon: this.planePosition[0] } + const homeLonLat = { lat: this.homePosition.lat, lon: this.homePosition.lon } + const horizontalDistance = geodist(planeLonLat, homeLonLat, { unit: 'meters' }) // 水平距离 const verticalDistance = Math.abs(this.planePosition[2] - this.homePosition.alt) // 垂直距离 const rtlDistance = horizontalDistance + verticalDistance // 返航总距离 水平+高度 rtlTime = Math.floor(Number(rtlDistance) / Number(this.wpnavSpeed)) // 返航需要时间 单位：秒 diff --git a/src/components/ControllerTabs.vue b/src/components/ControllerTabs.vue index 7adac76..0ea8570 100644 --- a/src/components/ControllerTabs.vue +++ b/src/components/ControllerTabs.vue @@ -959,6 +959,7 @@ export default { } }, mounted () { + console.log(this.$store.state.settings.host) // 初始化 if (this.executeOrder) { // 有正在执行单点 // 设置提示标签 diff --git a/src/components/MapBox.vue b/src/components/MapBox.vue index cdbbf19..ee37a22 100644 --- a/src/components/MapBox.vue +++ b/src/components/MapBox.vue @@ -15,9 +15,9 @@ export default { return { map: null, planes: [], // 飞机对象 - lngLats: [], // 航线 所有航点 - wayLngLats: [], // 航线 不包括起点航点 - takeoffLngLats: [], // 航线 第一个航点 起点 最后一个航点 + lonLats: [], // 航线 所有航点 + wayLonLats: [], // 航线 不包括起点航点 + takeoffLonLats: [], // 航线 第一个航点 起点 最后一个航点 isflow: false, // 飞机经纬度变化时是否跟随飞机 currentStyleIndex: 0, // 当前选中的地图样式索引 // 地图样式 @@ -156,8 +156,8 @@ export default { } }, computed: { - defaultLnglat () { - return this.$store.getters['app/getDefaultLngLat'] + defaultLonlat () { + return this.$store.getters['app/getDefaultLonLat'] }, defaultZoom () { return this.$store.getters['app/getDefaultZoom'] @@ -209,17 +209,17 @@ export default { this.map.on('mousedown', (event) => { // pc端点击事件 pressTimer = setTimeout(() => { - const lngLat = this.map.unproject(event.point) + const lonLat = this.map.unproject(event.point) // 将经纬度信息传递到组件外部 - this.$emit('longPress', lngLat) + this.$emit('longPress', lonLat) }, 1000) // 作为长按的时间阈值 }) this.map.on('touchstart', (event) => { // 移动端点击事件 pressTimer = setTimeout(() => { - const lngLat = this.map.unproject(event.point) + const lonLat = this.map.unproject(event.point) // 将经纬度信息传递到组件外部 - this.$emit('longPress', lngLat) + this.$emit('longPress', lonLat) }, 1000) // 作为长按的时间阈值 }) // 松手时点击事件不够 清除定时器模拟长按事件 @@ -242,7 +242,7 @@ export default { this.map = new mapboxgl.Map({ container: 'map', style: this.mapStyles[0], - center: this.defaultLnglat, + center: this.defaultLonlat, zoom: this.defaultZoom, pitch: 0, bearing: 0, @@ -299,13 +299,13 @@ export default { this.map.removeSource('home_point') this.map.removeLayer('takeoff_point_layer') this.map.removeSource('takeoff_point') - for (let i = 2; i < this.lngLats.length - 1; i++) { + for (let i = 2; i < this.lonLats.length - 1; i++) { this.map.removeLayer('way_point_layer' + i) this.map.removeSource('way_point' + i) } - this.lngLats = [] - this.wayLngLats = [] - this.takeoffLngLats = [] + this.lonLats = [] + this.wayLonLats = [] + this.takeoffLonLats = [] } }, /** @@ -317,24 +317,24 @@ export default { this.clearRoute() // 获取所有航点 及 非起点所有航点 routeObj.questAss.tasks.forEach((element, index) => { - const lngLat = [element.y, element.x, 100] - this.lngLats.push(lngLat) + const lonLat = [element.y, element.x, 100] + this.lonLats.push(lonLat) if (index > 1 && index < routeObj.questAss.taskcount - 1) { - this.wayLngLats.push(lngLat) + this.wayLonLats.push(lonLat) } }) // 跳转home点位置 - this.goto(this.lngLats[0]) + this.goto(this.lonLats[0]) // 起飞 降落虚线 - if (routeObj.questAss.tasks[this.lngLats.length - 1].command === 20) { - this.takeoffLngLats.push(this.lngLats[2]) - this.takeoffLngLats.push(this.lngLats[1]) - this.takeoffLngLats.push(this.lngLats[this.lngLats.length - 2]) + if (routeObj.questAss.tasks[this.lonLats.length - 1].command === 20) { + this.takeoffLonLats.push(this.lonLats[2]) + this.takeoffLonLats.push(this.lonLats[1]) + this.takeoffLonLats.push(this.lonLats[this.lonLats.length - 2]) } else if ( - routeObj.questAss.tasks[this.lngLats.length - 1].command === 21 + routeObj.questAss.tasks[this.lonLats.length - 1].command === 21 ) { - this.takeoffLngLats.push(this.lngLats[2]) - this.takeoffLngLats.push(this.lngLats[1]) + this.takeoffLonLats.push(this.lonLats[2]) + this.takeoffLonLats.push(this.lonLats[1]) } // 起飞降落虚线 @@ -345,7 +345,7 @@ export default { properties: {}, geometry: { type: 'LineString', - coordinates: this.takeoffLngLats + coordinates: this.takeoffLonLats } } }) @@ -372,7 +372,7 @@ export default { properties: {}, geometry: { type: 'LineString', - coordinates: this.wayLngLats + coordinates: this.wayLonLats } } }) @@ -405,7 +405,7 @@ export default { } }) // 航点 图标 PS:home点 起飞点 航点 送餐点等 - this.lngLats.forEach((item, index) => { + this.lonLats.forEach((item, index) => { // home点 if (index === 0) { // 第一点home点 @@ -441,10 +441,10 @@ export default { // 起飞点 let takeoffPoint // 起点图标设定 根据最后一个航点为RETURN_TO_LAUNCH 20 返回起点降落 或者 最后一个航点为LAND 21 指定点降落 - if (routeObj.questAss.tasks[this.lngLats.length - 1].command === 20) { + if (routeObj.questAss.tasks[this.lonLats.length - 1].command === 20) { takeoffPoint = 'takeoffLandPoint' } else if ( - routeObj.questAss.tasks[this.lngLats.length - 1].command === 21 + routeObj.questAss.tasks[this.lonLats.length - 1].command === 21 ) { takeoffPoint = 'takeoffPoint' } @@ -478,13 +478,13 @@ export default { }) } else { // waypoint点 - if (index !== this.lngLats.length - 1) { + if (index !== this.lonLats.length - 1) { // 最后一个点不显示 要不和最后一个点结合 要不和起点结合 let wayPoint = 'wayPoint' - if (index === this.lngLats.length - 2) { + if (index === this.lonLats.length - 2) { // 降落点 如果是LAND 21 和最后一个waypoint点结合 if ( - routeObj.questAss.tasks[this.lngLats.length - 1].command === 21 + routeObj.questAss.tasks[this.lonLats.length - 1].command === 21 ) { wayPoint = 'wayLandPoint' } @@ -582,7 +582,7 @@ export default { customIcon.style.height = '64px' // 图标高度 // 创建一个marker对象 this.planes[index] = new mapboxgl.Marker(customIcon) - .setLngLat([plane.lng, plane.lat]) + .setLngLat([plane.lon, plane.lat]) .setPopup( new mapboxgl.Popup({ offset: 25 }).setHTML( '

' + plane.name + '

macID:' + plane.macadd + '

' @@ -601,22 +601,22 @@ export default { }, /** * @description: 实时更新经纬度 - * @param {obj} lnglat lng经度 lat纬度 + * @param {obj} lonLat lon经度 lat纬度 * @param {*} index 飞机序号 * @param {*} pathArr 飞机轨迹 痕迹坐标数组 */ - setPlaneLngLat (lnglat, index, pathArr) { + setPlaneLonLat (lonLat, index, pathArr) { // 设置新的经纬度 const plane = this.planes[index] if (plane != null) { - plane.setLngLat([lnglat.lng, lnglat.lat]) + plane.setLngLat([lonLat.lon, lonLat.lat]) } // 创建轨迹 this.createPathWithArray(pathArr) // 创建轨迹 // 镜头跟随飞机 if (this.isflow) { this.map.flyTo({ - center: lnglat, + center: lonLat, speed: 2, curve: 1, easing (t) { @@ -627,11 +627,11 @@ export default { }, /** * @description: 镜头跳转 - * @param {obj} lnglat {lng:lng,lat:lat} 经纬度 + * @param {obj} lonLat {lon:lon,lat:lat} 经纬度 */ - goto (lnglat) { + goto (lonLat) { this.map.flyTo({ - center: lnglat, + center: lonLat, speed: 2, curve: 1, easing (t) { @@ -662,7 +662,7 @@ export default { }, beforeDestroy () { if (this.map) { - this.$store.commit('app/setDefaultLngLat', this.map.getCenter()) // 记录当前经纬度 缺省 + this.$store.commit('app/setDefaultLonLat', this.map.getCenter()) // 记录当前经纬度 缺省 this.$store.commit('app/setDefaultZoom', this.map.getZoom()) // 记录当前经纬度 缺省 this.map.remove() // 清除地图资源 } diff --git a/src/store/modules/app.js b/src/store/modules/app.js index eb3e6e6..50c55f4 100644 --- a/src/store/modules/app.js +++ b/src/store/modules/app.js @@ -3,7 +3,7 @@ const state = { isCollapse: localStorage.getItem('isCollapse') ? !!+localStorage.getItem('isCollapse') : true, // 侧边导航栏 显隐 isMobile: null, // 是否是pc端 true电脑端 false为移动端 isWideScreen: window.innerWidth < 480, // 屏幕宽度是否小于480 - defaultLngLat: null, // 地图默认经纬度 + defaultLonLat: null, // 地图默认经纬度 defaultZoom: null, // 地图默认缩放 orderSerch: null// 订单列表页搜索条件 } @@ -32,9 +32,9 @@ const mutations = { } }, // 设置地图默认经纬度 - setDefaultLngLat (state, lngLat) { - state.defaultLngLat = lngLat - localStorage.setItem('defaultLngLat', JSON.stringify(lngLat)) + setDefaultLonLat (state, lonLat) { + state.defaultLonLat = lonLat + localStorage.setItem('defaultLonLat', JSON.stringify(lonLat)) }, // 设置地图默认缩放值 setDefaultZoom (state, zoom) { @@ -57,8 +57,8 @@ const actions = { } const getters = { // 获取地图默认经纬度 缓存中没有从 localStorage中获取 也没有设置为0 - getDefaultLngLat () { - return state.defaultLngLat !== null ? state.defaultLngLat : localStorage.getItem('defaultLngLat') !== null ? JSON.parse(localStorage.getItem('defaultLngLat')) : { lng: 0, lat: 0 } + getDefaultLonLat () { + return state.defaultLonLat !== null ? state.defaultLonLat : localStorage.getItem('defaultLonLat') !== null ? JSON.parse(localStorage.getItem('defaultLonLat')) : { lon: 0, lat: 0 } }, // 获取地图默认缩放值 缓存中没有从 localStorage中获取 也没有设置为1 getDefaultZoom () { diff --git a/src/views/layout/components/main/home/index.vue b/src/views/layout/components/main/home/index.vue index 5e5a979..4594165 100644 --- a/src/views/layout/components/main/home/index.vue +++ b/src/views/layout/components/main/home/index.vue @@ -30,9 +30,9 @@ export default { }, methods: { // 地图长按事件 测试 - handleDemo (lngLat) { - console.log('经度:', lngLat.lng) - console.log('维度:', lngLat.lat) + handleDemo (lonLat) { + console.log('经度:', lonLat.lon) + console.log('维度:', lonLat.lat) }, /** * @description: 创建飞机图标 @@ -40,13 +40,13 @@ export default { makePlanes (planes) { this.$refs.mapbox.removePlanes()// 先清除画布上现有的飞机 planes.forEach((plane, index) => { // 创建所有飞机 - let planeDefaultLngLat + let planeDefaultLonLat if (localStorage.getItem(plane.name) !== null) { // 从本地缓存 拿飞机得初始位置 - planeDefaultLngLat = JSON.parse(localStorage.getItem(plane.name)) - plane.lng = planeDefaultLngLat.lng - plane.lat = planeDefaultLngLat.lat + planeDefaultLonLat = JSON.parse(localStorage.getItem(plane.name)) + plane.lon = planeDefaultLonLat.lon + plane.lat = planeDefaultLonLat.lat } else { - plane.lng = 0 + plane.lon = 0 plane.lat = 0 } this.$refs.mapbox.makePlane(plane, index) diff --git a/src/views/layout/components/main/planes/index.vue b/src/views/layout/components/main/planes/index.vue index 559d726..2e318b0 100644 --- a/src/views/layout/components/main/planes/index.vue +++ b/src/views/layout/components/main/planes/index.vue @@ -61,18 +61,18 @@ export default { * @description: 创建飞机图标 */ makePlane (plane) { - let planeDefaultLngLat + let planeDefaultLonLat if (localStorage.getItem(plane.name)) { // 从本地缓存 拿飞机得初始位置 - planeDefaultLngLat = JSON.parse(localStorage.getItem(plane.name)) - plane.lng = planeDefaultLngLat.lng - plane.lat = planeDefaultLngLat.lat + planeDefaultLonLat = JSON.parse(localStorage.getItem(plane.name)) + plane.lon = planeDefaultLonLat.lon + plane.lat = planeDefaultLonLat.lat } else { - plane.lng = 0 + plane.lon = 0 plane.lat = 0 } this.$refs.mapbox.removePlanes()// 先清除画布上现有的飞机 this.$refs.mapbox.makePlane(plane)// 创建飞机 - this.$refs.mapbox.goto({ lng: plane.lng, lat: plane.lat })// 跳转到飞机位置 + this.$refs.mapbox.goto({ lon: plane.lon, lat: plane.lat })// 跳转到飞机位置 }, /** * @description: 创建航线 @@ -111,13 +111,13 @@ export default { handler (val) { const len = val.length if (len > 2) { - const lng = val[len - 1][0] + const lon = val[len - 1][0] const lat = val[len - 1][1] this.localCount++// 计数器 叠加 if (this.localCount % 100 === 1) { - localStorage.setItem(this.plane.name, `{ "lng": ${lng}, "lat": ${lat} }`) + localStorage.setItem(this.plane.name, `{ "lon": ${lon}, "lat": ${lat} }`) } - this.$refs.mapbox.setPlaneLngLat({ lng: lng, lat: lat }, 0, val)// 更新飞机位置 并画出轨迹 跟随飞机 + this.$refs.mapbox.setPlaneLonLat({ lon: lon, lat: lat }, 0, val)// 更新飞机位置 并画出轨迹 跟随飞机 } }, deep: true diff --git a/src/views/layout/index.vue b/src/views/layout/index.vue index 5e05b19..c101849 100644 --- a/src/views/layout/index.vue +++ b/src/views/layout/index.vue @@ -94,18 +94,18 @@ export default { } else if (key === 'position') { // 如果是飞机位置信息 则不是直接刷新状态 而是累计 到数组 以便于画出飞机路径 const position = JSON.parse(jsonData.position) - // 检查 lng, lat, 和 alt 是否不全为零或空值 - if (position.lng !== 0 && position.lat !== 0 && - position.lng !== null && position.lat !== null && - position.lng !== '' && position.lat !== '') { - plane.planeState.position.push([position.lng / 10e6, position.lat / 10e6, Number(position.alt)]) + // 检查 lon, lat, 和 alt 是否不全为零或空值 + if (position.lon !== 0 && position.lat !== 0 && + position.lon !== null && position.lat !== null && + position.lon !== '' && position.lat !== '') { + plane.planeState.position.push([position.lon / 10e6, position.lat / 10e6, Number(position.alt)]) } if (plane.planeState.position.length > 1000) { plane.planeState.position.shift() // 删除最早的经纬度 } } else if (key === 'homePosition') { const homePosition = JSON.parse(jsonData.homePosition)// home点反序列化再赋值 - homePosition.lng = homePosition.lng / 10e6 + homePosition.lon = homePosition.lon / 10e6 homePosition.lat = homePosition.lat / 10e6 homePosition.alt = Number(homePosition.alt) plane.planeState[key] = homePosition