Compare commits
No commits in common. "9a94cd4e0ec51ecabc655654b214c1d3d435ab91" and "e83e91434742112d7100e93e6a770bdd9104d475" have entirely different histories.
9a94cd4e0e
...
e83e914347
|
@ -58,8 +58,8 @@ export default class MapComponent extends Vue {
|
|||
}
|
||||
mounted(){
|
||||
window.addEventListener("resize",this.resize)
|
||||
// document.addEventListener("mousemove", this.fixedCamera)
|
||||
this.player = this.playerUtils.initPlayer(this.id,"2423385884355");
|
||||
document.addEventListener("mousemove", this.fixedCamera)
|
||||
this.player = this.playerUtils.initPlayer(this.id);
|
||||
this.playerApi = this.player.getAPI();
|
||||
|
||||
}
|
||||
|
|
|
@ -18,10 +18,7 @@ export class MockData{
|
|||
id:Mock.mock("@id"),
|
||||
name:Mock.mock("@cname"),
|
||||
job:"安全顾问",
|
||||
position:turf.randomPosition([
|
||||
11660757, 3692398.75,
|
||||
11661124, 3692643.5
|
||||
]),
|
||||
position:turf.randomPosition([119.588709 ,34.514257,119.596724,34.520382]),
|
||||
time:moment().subtract(Math.floor(Math.random()*30),"minutes").format("YYYY-MM-DD HH:mm:ss"),
|
||||
tel:Mock.mock("@integer(13200000000, 13299999999)")
|
||||
})
|
||||
|
@ -504,10 +501,7 @@ export class MockData{
|
|||
time:moment().subtract(Math.floor(Math.random()*30),"minutes").format("YYYY-MM-DD HH:mm:ss"),
|
||||
startTime : "7:00",
|
||||
endTime : "8:00",
|
||||
position:turf.randomPosition([
|
||||
11660757, 3692398.75,
|
||||
11661124, 3692643.5
|
||||
]),
|
||||
position:turf.randomPosition([119.588709 ,34.514257,119.596724,34.520382]),
|
||||
plate:plateList[i%5],
|
||||
remark:typeList[i%3],
|
||||
type:i%2
|
||||
|
|
|
@ -18,34 +18,23 @@ enum COLOR{
|
|||
// 四色图-红
|
||||
RED="#FF5959"
|
||||
}
|
||||
import CloseService from "@/service/close.service";
|
||||
import ParkFileService from "@/service/park.service";
|
||||
import Vue from "vue";
|
||||
const service = new CloseService();
|
||||
const parkService = new ParkFileService()
|
||||
const glob = new Vue();
|
||||
export default [ {
|
||||
name:"电子围栏",
|
||||
ids:[] as string[],
|
||||
type:"area",
|
||||
value:"bounds",
|
||||
color:COLOR.BOUNDS,
|
||||
init:async ()=>{
|
||||
return await parkService.getRealBounds()
|
||||
},
|
||||
selected:false,
|
||||
pages:["manage"]
|
||||
},{
|
||||
name:"人员定位",
|
||||
ids:[] as string[],
|
||||
type:"moveMarker",
|
||||
init:async ()=>{
|
||||
return await service.getPeopleList()
|
||||
},
|
||||
value:"peo",
|
||||
url: "@path:people.png",
|
||||
pakFilePath: "@path:DTS_Library_V5.4.pak",
|
||||
assetPath:"/JC_CustomAssets/VehicleLibrary/Exhibition/重型货车_01",
|
||||
scale:[0,0,0],
|
||||
coordinateType:1,
|
||||
selected:false,
|
||||
pages:["home","view"]
|
||||
},{
|
||||
|
@ -53,16 +42,14 @@ export default [ {
|
|||
ids:[] as string[],
|
||||
type:"moveMarker",
|
||||
value:"car",
|
||||
pakFilePath: "@path:DTS_Library_V5.4.pak",
|
||||
assetPath:"/JC_CustomAssets/VehicleLibrary/Exhibition/重型货车_01",
|
||||
urls:[
|
||||
"@path:car.png",
|
||||
"@path:d-car.png",
|
||||
"@path:d-car.png",
|
||||
],
|
||||
init:async ()=>{
|
||||
return await service.getCarList()
|
||||
},
|
||||
scale:[0,0,0],
|
||||
coordinateType:1,
|
||||
selected:false,
|
||||
pages:["home","view"]
|
||||
}]
|
||||
|
|
|
@ -17,7 +17,6 @@ export default new Vuex.Store({
|
|||
specialEnvList:[],
|
||||
dangrousList:[],
|
||||
safeGoods:[],
|
||||
boundsData:[]
|
||||
},
|
||||
getters: {
|
||||
},
|
||||
|
@ -25,14 +24,39 @@ export default new Vuex.Store({
|
|||
setPeopleList(state,data){
|
||||
state.peopleList = data;
|
||||
},
|
||||
setCompanyList(state,data){
|
||||
state.companyList = data;
|
||||
},
|
||||
setCarList(state,data){
|
||||
state.carList = data;
|
||||
},
|
||||
setCameraList(state,data){
|
||||
state.cameraList = data;
|
||||
},
|
||||
setBoundsData(state,data){
|
||||
state.boundsData = data;
|
||||
upDateWaringList(state:any,data){
|
||||
state.warningList = [...data,...state.warningList];
|
||||
|
||||
},
|
||||
setHiddenDangrousList(state:any,data){
|
||||
state.hiddenDangrousList = data;
|
||||
},
|
||||
setDangrousWorkList(state:any,data){
|
||||
state.dangrousWorkList = data;
|
||||
},
|
||||
setGroundEnvList(state:any,data){
|
||||
state.groundEnvList = data;
|
||||
},
|
||||
setSpecialEnvList(state:any,data){
|
||||
state.specialEnvList = data;
|
||||
},
|
||||
upDateEventList(state:any,data){
|
||||
state.eventList = [...data,...state.eventList];
|
||||
},
|
||||
setDangrousList(state:any,data){
|
||||
state.dangrousList = data;
|
||||
},
|
||||
setSafeGoods(state:any,data){
|
||||
state.safeGoods = data;
|
||||
},
|
||||
},
|
||||
actions: {
|
||||
|
|
|
@ -5,10 +5,9 @@ import * as acapi from '../../public/ac.min.js'
|
|||
// import acapi from 'ac.min.js'
|
||||
export default class PlayerUtils{
|
||||
public api:any;
|
||||
public initPlayer(domId,iid?){
|
||||
public initPlayer(domId){
|
||||
const player = new acapi.DigitalTwinPlayer(process.env.VUE_APP_PALYER_URL,{
|
||||
domId,
|
||||
iid,
|
||||
// reset:true,
|
||||
apiOptions:{
|
||||
onReady: this.onReady,
|
||||
|
@ -53,10 +52,8 @@ export default class PlayerUtils{
|
|||
public onMouseLeave :any= null;
|
||||
public onMouseMove :any= null;
|
||||
public onMouseDown :any= null;
|
||||
public onMouseUp :any= (res)=>{
|
||||
this.api.camera.get((data)=>{
|
||||
console.log(data)
|
||||
})
|
||||
public onMouseUp :any= (data)=>{
|
||||
console.log(data)
|
||||
};;
|
||||
public onKeyDown :any= null;
|
||||
public onKeyUp :any= null;
|
||||
|
@ -126,15 +123,12 @@ export default class PlayerUtils{
|
|||
* @returns 经纬度 lon,lat]
|
||||
*/
|
||||
|
||||
public async getLonLat(coordinates,coordinateType?,fn?){
|
||||
public getLonLat(coordinates,coordinateType?,fn?){
|
||||
if(!coordinateType){
|
||||
// 1 84坐标系 2 GCJ02 3 BD09
|
||||
coordinateType=1;
|
||||
}
|
||||
if(!coordinates[2]){
|
||||
coordinates[2] = 0
|
||||
}
|
||||
const result = await this.api.coord.pcs2gcs(coordinates,coordinateType,fn)
|
||||
const result = this.api.coord.pcs2gcs(coordinates,coordinateType,fn)
|
||||
if(result.resultMessage==="OK"){
|
||||
return result.coordinates
|
||||
}else{
|
||||
|
|
|
@ -46,13 +46,19 @@ export default class BaseComponent extends Vue {
|
|||
return
|
||||
}
|
||||
this.player.api.camera.lookAt(
|
||||
11660869.788125,
|
||||
3692656.110371,
|
||||
194.028672,
|
||||
13312716.658437,
|
||||
4098255.982695,
|
||||
60.714346,
|
||||
0,
|
||||
-59.638443,
|
||||
63.604168
|
||||
-20,
|
||||
-45
|
||||
)
|
||||
// this.player.api.camera.get((res)=>{
|
||||
// console.log(res)
|
||||
// })
|
||||
|
||||
// return await this.player.api.tileLayer.focus("48D390964B7F0D37D07DD8A2D5596E64",330,time)
|
||||
|
||||
}
|
||||
|
||||
// 添加电子围栏 // 安全线 // 实控线 // 规划线
|
||||
|
@ -84,152 +90,6 @@ export default class BaseComponent extends Vue {
|
|||
}
|
||||
}
|
||||
|
||||
public async addMarker(layer,trackCustom?){
|
||||
if(!layer.ids.length){
|
||||
const options = layer.data.map((item,index)=>{
|
||||
return {
|
||||
id:item.id,
|
||||
groupId:layer.value,
|
||||
coordinate:item.position,
|
||||
coordinateType:layer.coordinateType?layer.coordinateType:0,
|
||||
displayMode:2,
|
||||
imagePath:layer.url || layer.urls[item.type],
|
||||
imageSize:[48,48],
|
||||
// popupURL:"http://192.168.1.20:8080/#/popup?"+new URLSearchParams(item),
|
||||
lineSize:[2,40],
|
||||
useTextAnimation: false,
|
||||
lineOffset:[24,0],
|
||||
autoHeight:true,
|
||||
}
|
||||
})
|
||||
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);
|
||||
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)
|
||||
// })
|
||||
|
||||
// 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)
|
||||
}else{
|
||||
layer.ids = options.map(item=>item.id);
|
||||
}
|
||||
}
|
||||
})
|
||||
}else{
|
||||
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.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){
|
||||
clearInterval(this.timerList[layer.value]);
|
||||
this.timerList[layer.value] = null;
|
||||
}
|
||||
this.player.api.marker.hide(layer.ids)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
public addCustom(layer,needMarker?){
|
||||
if(!layer.ids.length){
|
||||
const options = layer.data.map((item,index)=>{
|
||||
return {
|
||||
id:item.id,
|
||||
groupId:layer.value,
|
||||
pakFilePath:this.pakFilePath,
|
||||
assetPath:layer.assetPath,
|
||||
location:item.position,
|
||||
smoothMotion:1,
|
||||
scale:layer.scale,
|
||||
rotation:[0,90,0]
|
||||
}
|
||||
})
|
||||
this.player.api.customObject.add(options,(data)=>{
|
||||
if(data.resultMessage==="OK"){
|
||||
if(needMarker){
|
||||
this.addMarker(layer,needMarker)
|
||||
}else{
|
||||
layer.ids = options.map(item=>item.id)
|
||||
}
|
||||
}
|
||||
})
|
||||
}else{
|
||||
if(layer.selected){
|
||||
this.player.api.customObject.show(layer.ids)
|
||||
}else{
|
||||
this.player.api.customObject.hide(layer.ids)
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
public onFocus(data){
|
||||
this.player.api[data.type].focus(data.id)
|
||||
|
@ -245,13 +105,7 @@ export default class BaseComponent extends Vue {
|
|||
//
|
||||
}
|
||||
destroyed(){
|
||||
this.layerData.forEach(item=>{
|
||||
if(this.timerList[item.value]){
|
||||
clearInterval(this.timerList[item.value]);
|
||||
this.timerList[item.value] = null;
|
||||
}
|
||||
|
||||
})
|
||||
//
|
||||
}
|
||||
|
||||
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<div class="overview-container">
|
||||
|
||||
<MapComponent id="map" @onLoaded="getMap" @onHandleChange="handleChange"></MapComponent>
|
||||
<!-- <MapComponent id="map" @onLoaded="getMap" @onHandleChange="handleChange"></MapComponent>-->
|
||||
|
||||
<div class="bg-box left animate__animated">
|
||||
<div class="panel-container">
|
||||
|
|
|
@ -34,8 +34,8 @@ export default class OverViewComponent extends BaseComponent {
|
|||
|
||||
// 是否隐藏除地图外所有板块
|
||||
public hideAllPanel = false;
|
||||
async created(){
|
||||
// this.currentLayers = this.getCurrentLayers();
|
||||
created(){
|
||||
this.currentLayers = this.getCurrentLayers()
|
||||
}
|
||||
public upDateEventList(){
|
||||
const eventList = MockData.getEventList().data
|
||||
|
@ -47,6 +47,19 @@ export default class OverViewComponent extends BaseComponent {
|
|||
this.$store.commit("setHiddenDangrousList",res.data)
|
||||
})
|
||||
}
|
||||
// 获取车辆
|
||||
public getCarList(){
|
||||
this.closeService.getCarList().then((res)=>{
|
||||
this.dataList["car"] = res.data;
|
||||
this.$store.commit("setCarList",res.data)
|
||||
})
|
||||
}// 获取车辆
|
||||
public getPersonList(){
|
||||
this.closeService.getPeopleList().then((res)=>{
|
||||
this.dataList["peo"] = res.data;
|
||||
this.$store.commit("setPeopleList",res.data)
|
||||
})
|
||||
}
|
||||
// 地图初始化后
|
||||
public getMap(store: any) {
|
||||
this.player = store;
|
||||
|
@ -63,15 +76,15 @@ export default class OverViewComponent extends BaseComponent {
|
|||
}
|
||||
|
||||
public handleChange(data) {
|
||||
console.log(data)
|
||||
if(data.GroupID){
|
||||
const currentData = this.dataList[data.GroupID].find(item=>item.id === data.Id);
|
||||
}
|
||||
}
|
||||
|
||||
public navChange(data: string) {
|
||||
this.currentNav = data;
|
||||
this.currentLayers = this.getCurrentLayers()
|
||||
if(this.player){
|
||||
this.currentLayers = this.getCurrentLayers()
|
||||
this.resetMap();
|
||||
}
|
||||
console.log('当前点击导航', data)
|
||||
|
@ -123,9 +136,6 @@ export default class OverViewComponent extends BaseComponent {
|
|||
return
|
||||
}
|
||||
layer.selected = !layer.selected;
|
||||
if(layer.type === "moveMarker"){
|
||||
this.addMarker(layer,true)
|
||||
}
|
||||
}
|
||||
//进入自由导览
|
||||
showView(){
|
||||
|
@ -157,10 +167,7 @@ export default class OverViewComponent extends BaseComponent {
|
|||
|
||||
public getCurrentLayers(){
|
||||
const layers = [] as any;
|
||||
this.layerData.forEach(async (item:any)=>{
|
||||
if(!item.data){
|
||||
item.data = (await item.init()).data
|
||||
}
|
||||
this.layerData.forEach((item:any)=>{
|
||||
if(item.pages.includes(this.currentNav)){
|
||||
if(!item.selected){
|
||||
this.toggleLayer(item)
|
||||
|
@ -172,7 +179,6 @@ export default class OverViewComponent extends BaseComponent {
|
|||
}
|
||||
}
|
||||
})
|
||||
console.log(layers)
|
||||
return layers
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue