From c9a45ca8f6dc09185670b252788ebe788f44eaaa Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=90=B4=E5=BB=B6=E7=A6=8F?= <> Date: Wed, 17 May 2023 16:48:12 +0800 Subject: [PATCH] =?UTF-8?q?feat:=E6=96=B0=E5=A2=9E=E8=87=AA=E7=94=B1?= =?UTF-8?q?=E5=AF=BC=E8=A7=88?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/mock/index.ts | 4 +- src/views/base.component.ts | 130 ++++++++++++++++---------------- src/views/overview.component.ts | 33 ++++++-- 3 files changed, 94 insertions(+), 73 deletions(-) diff --git a/src/mock/index.ts b/src/mock/index.ts index 6f281f9..9201219 100644 --- a/src/mock/index.ts +++ b/src/mock/index.ts @@ -13,7 +13,7 @@ import dangrous from "./dangrous"; export class MockData{ public static getPeopleList(){ const data = [] as any; - for(let i=0;i<100;i++){ + for(let i=0;i<50;i++){ data.push({ id:Mock.mock("@id"), name:Mock.mock("@cname"), @@ -498,7 +498,7 @@ export class MockData{ const plateList = ["苏A7E8U6","苏A3X4K5","苏J8868P","苏A7E8U6","苏A9H2K0"]; const typeList = ["罐车","挂车","油车"]; const data = [] as any; - for(let i=0;i<20;i++){ + for(let i=0;i<10;i++){ data.push({ id:Mock.mock("@id"), time:moment().subtract(Math.floor(Math.random()*30),"minutes").format("YYYY-MM-DD HH:mm:ss"), diff --git a/src/views/base.component.ts b/src/views/base.component.ts index bbbdbbb..3ee7eb4 100644 --- a/src/views/base.component.ts +++ b/src/views/base.component.ts @@ -105,49 +105,48 @@ export default class BaseComponent extends Vue { this.player.api.marker.add(options,(data)=>{ if(data.resultMessage==="OK"){ if(trackCustom){ - this.player.api.marker.setAttachCustomObject(options.map(item=>{ - layer.ids.push(item.id); + this.player.api.marker.setAttachCustomObject(layer.data.map(item=>{ return{ markerId: item.id, //标注id objectId: item.id, //自定义对象id offset: [0, 0, 0] //偏移量 } - })); - // this.player.api.customObject.moveTo(layer.data.map(async(item)=>{ - // const position = (await this.player.utils.getLonLat(item.position))[0] - // const newPosition = turf.destination(turf.point(position),layer.value==="car"?50:1,Math.random()*360,{units:"meters"}).geometry.coordinates - // const newLocation = (await this.player.utils.getPosition(newPosition))[0]; - // if(!newLocation[2]){ - // newLocation[2] = 0 - // } - // console.log(item.id,item.position,newLocation) - // return { - // id:item.id, - // location:newLocation, - // "smoothTime": 5 - // } - // }),(data)=>{ - // console.log(data) - // }) + }),(res)=>{ + console.log(res) + }); + this.player.api.customObject.moveTo(layer.data.map(async(item)=>{ + const position = (await this.player.utils.getLonLat(item.position))[0] + const newPosition = turf.destination(turf.point(position),layer.value==="car"?50:1,Math.random()*360,{units:"meters"}).geometry.coordinates + const newLocation = (await this.player.utils.getPosition(newPosition))[0]; + if(!newLocation[2]){ + newLocation[2] = 0 + } + return { + id:item.id, + location:newLocation, + "smoothTime": 5 + } + }),(data)=>{ + console.log(data) + }) - // this.timerList[layer.value] = setInterval(()=>{ - // this.player.api.customObject.moveTo(layer.data.map(async(item)=>{ - // const position = (await this.player.utils.getLonLat(item.position))[0] - // const newPosition = turf.destination(turf.point(position),layer.value==="car"?50:1,Math.random()*360,{units:"meters"}).geometry.coordinates - // const newLocation = (await this.player.utils.getPosition(newPosition))[0]; - // if(!newLocation[2]){ - // newLocation[2] = 0 - // } - // console.log(item.id,item.position,newLocation) - // return { - // id:item.id, - // location:newLocation, - // "smoothTime": 5 - // } - // }),(data)=>{ - // console.log(data) - // }) - // },5000) + this.timerList[layer.value] = setInterval(()=>{ + this.player.api.customObject.moveTo(layer.data.map(async(item)=>{ + const position = (await this.player.utils.getLonLat(item.position))[0] + const newPosition = turf.destination(turf.point(position),layer.value==="car"?50:1,Math.random()*360,{units:"meters"}).geometry.coordinates + const newLocation = (await this.player.utils.getPosition(newPosition))[0]; + if(!newLocation[2]){ + newLocation[2] = 0 + } + return { + id:item.id, + location:newLocation, + "smoothTime": 5 + } + }),(data)=>{ + console.log(data) + }) + },5000) }else{ layer.ids = options.map(item=>item.id); } @@ -157,35 +156,35 @@ export default class BaseComponent extends Vue { if(layer.selected){ this.player.api.marker.show(layer.ids) if(trackCustom){ - // this.player.api.customObject.moveTo(layer.data.map(async(item)=>{ - // const position = (await this.player.utils.getLonLat(item.position))[0] - // const newPosition = turf.destination(turf.point(position),layer.value==="car"?50:1,Math.random()*360,{units:"meters"}).geometry.coordinates - // const newLocation = (await this.player.utils.getPosition(newPosition))[0]; - // if(!newLocation[2]){ - // newLocation[2] = 0 - // } - // return { - // id:item.id, - // location:newLocation, - // "smoothTime": 5 - // } - // })) + this.player.api.customObject.moveTo(layer.data.map(async(item)=>{ + const position = (await this.player.utils.getLonLat(item.position))[0] + const newPosition = turf.destination(turf.point(position),layer.value==="car"?50:1,Math.random()*360,{units:"meters"}).geometry.coordinates + const newLocation = (await this.player.utils.getPosition(newPosition))[0]; + if(!newLocation[2]){ + newLocation[2] = 0 + } + return { + id:item.id, + location:newLocation, + "smoothTime": 5 + } + })) - // this.timerList[layer.value] = setInterval(()=>{ - // this.player.api.customObject.moveTo(layer.data.map(async(item)=>{ - // const position = (await this.player.utils.getLonLat(item.position))[0] - // const newPosition = turf.destination(turf.point(position),layer.value==="car"?50:1,Math.random()*360,{units:"meters"}).geometry.coordinates - // const newLocation = (await this.player.utils.getPosition(newPosition))[0]; - // if(!newLocation[2]){ - // newLocation[2] = 0 - // } - // return { - // id:item.id, - // location:newLocation, - // "smoothTime": 5 - // } - // })) - // },5000) + this.timerList[layer.value] = setInterval(()=>{ + this.player.api.customObject.moveTo(layer.data.map(async(item)=>{ + const position = (await this.player.utils.getLonLat(item.position))[0] + const newPosition = turf.destination(turf.point(position),layer.value==="car"?50:1,Math.random()*360,{units:"meters"}).geometry.coordinates + const newLocation = (await this.player.utils.getPosition(newPosition))[0]; + if(!newLocation[2]){ + newLocation[2] = 0 + } + return { + id:item.id, + location:newLocation, + "smoothTime": 5 + } + })) + },5000) } }else{ if(trackCustom){ @@ -214,6 +213,7 @@ export default class BaseComponent extends Vue { this.player.api.customObject.add(options,(data)=>{ if(data.resultMessage==="OK"){ if(needMarker){ + console.log(data) this.addMarker(layer,needMarker) }else{ layer.ids = options.map(item=>item.id) diff --git a/src/views/overview.component.ts b/src/views/overview.component.ts index f4595a9..afbf9e0 100644 --- a/src/views/overview.component.ts +++ b/src/views/overview.component.ts @@ -56,6 +56,7 @@ export default class OverViewComponent extends BaseComponent { this.player.api.polygon3d.clear(); this.player.api.marker.clear(); this.player.api.marker3d.clear(); + this.player.api.settings.setInteractiveMode(0); this.player.api.polyline.clear(); this.player.api.heatmap.clear(); this.currentLayers = this.getCurrentLayers(); @@ -109,8 +110,12 @@ export default class OverViewComponent extends BaseComponent { } public toggleAllPanel(){ - this.hideAllPanel = true; - this.drawerChange(false) + this.hideAllPanel = !this.hideAllPanel; + this.drawerChange(!this.hideAllPanel) + if(!this.hideAllPanel){ + + this.player.api.settings.setInteractiveMode(0) + } } public toggleHeight(){ @@ -124,11 +129,25 @@ export default class OverViewComponent extends BaseComponent { } layer.selected = !layer.selected; if(layer.type === "moveMarker"){ - this.addMarker(layer,true) + this.addCustom(layer,true) } } //进入自由导览 showView(){ + this.toggleAllPanel(); + this.player.api.camera.lookAt( + 11660667.474375, + 3692632.815, + 11.3054, + 0, + -0.822798, + 88.42289, + 2, + ()=>{ + this.player.api.settings.setInteractiveMode(1); + this.player.api.settings.setMainUIVisibility(false) + }) + //todo 进入自由导览 } //展开导览右侧 @@ -177,9 +196,11 @@ export default class OverViewComponent extends BaseComponent { } - - - destroyed() { + + deactivated(){ + console.log(123) + } + beforeDestory() { if (this.player) { this.player = null }