2020-09-18 06:38:05 +00:00
|
|
|
import { Component, OnInit,Input,Host } from '@angular/core';
|
2022-09-28 16:16:11 +00:00
|
|
|
import { OldCircularArc } from 'arcgis-rest-api';
|
|
|
|
import { Map } from 'ol';
|
|
|
|
import { Interaction} from 'ol/interaction';
|
2020-09-18 06:38:05 +00:00
|
|
|
import { MapComponent } from 'ngx-openlayers';
|
|
|
|
import OLCesium from 'ol-cesium';
|
|
|
|
|
2020-09-18 12:20:33 +00:00
|
|
|
declare var olcs: any;
|
2020-09-18 06:38:05 +00:00
|
|
|
|
|
|
|
@Component({
|
2020-10-02 15:20:00 +00:00
|
|
|
selector: 'fm-map3d-switch2d3d',
|
2021-01-30 10:14:25 +00:00
|
|
|
templateUrl: './switch2d3d.component.html',
|
2020-09-18 15:19:29 +00:00
|
|
|
styleUrls: ['./switch2d3d.component.scss']
|
2020-09-18 06:38:05 +00:00
|
|
|
})
|
|
|
|
export class Switch2D3DComponent {
|
|
|
|
|
|
|
|
@Input() enable:boolean;
|
|
|
|
public label: string = "3D";
|
|
|
|
private ol3d: OLCesium;
|
2020-09-18 12:20:33 +00:00
|
|
|
private synchronizers:any[];
|
2021-01-30 15:40:25 +00:00
|
|
|
public loading:boolean = true;
|
2022-09-28 16:16:11 +00:00
|
|
|
private interactions:Interaction[] = [];
|
2020-09-18 06:38:05 +00:00
|
|
|
|
|
|
|
|
2021-01-26 08:12:37 +00:00
|
|
|
constructor(private map: MapComponent) {
|
2020-09-18 06:38:05 +00:00
|
|
|
|
|
|
|
}
|
|
|
|
|
2020-09-18 12:20:33 +00:00
|
|
|
ngOnInit() {
|
2020-09-18 15:19:29 +00:00
|
|
|
|
|
|
|
this.ol3d = new OLCesium({ map: this.map.instance, createSynchronizers: (map,scene) => {
|
2020-09-18 12:20:33 +00:00
|
|
|
this.synchronizers = [
|
|
|
|
new olcs.RasterSynchronizer(map,scene),
|
|
|
|
new olcs.VectorSynchronizer(map,scene)
|
|
|
|
];
|
2021-01-30 15:40:25 +00:00
|
|
|
this.loading=false;
|
2020-09-18 12:20:33 +00:00
|
|
|
return this.synchronizers;
|
2020-09-18 15:19:29 +00:00
|
|
|
}, stopOpenLayersEventsPropagation:true});
|
2021-02-03 16:28:35 +00:00
|
|
|
this.ol3d.warmUp(3000,5000);
|
2020-09-18 12:20:33 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
synchronize() {
|
|
|
|
this.synchronizers.forEach((synchronizer) => {
|
|
|
|
synchronizer.synchronize();
|
|
|
|
});
|
2020-09-18 06:38:05 +00:00
|
|
|
}
|
|
|
|
|
2022-09-28 16:16:11 +00:00
|
|
|
disableInteractions() {
|
|
|
|
this.interactions=[];
|
|
|
|
this.map.instance.getInteractions().forEach((i) => {
|
|
|
|
if(i.getActive()) {
|
|
|
|
this.interactions.push(i);
|
|
|
|
i.setActive(false);
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
enableInteractions() {
|
|
|
|
this.interactions.forEach((i) => {
|
|
|
|
i.setActive(true);
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
2020-09-18 06:38:05 +00:00
|
|
|
handleClick(event) {
|
2020-09-18 12:20:33 +00:00
|
|
|
this.enable = !this.enable;
|
|
|
|
if(this.enable) {
|
2022-09-28 16:16:11 +00:00
|
|
|
this.disableInteractions();
|
|
|
|
this.synchronize();
|
|
|
|
this.ol3d.setEnabled(true);
|
|
|
|
} else {
|
|
|
|
this.ol3d.setEnabled(false);
|
|
|
|
this.enableInteractions();
|
2020-09-18 12:20:33 +00:00
|
|
|
}
|
2022-09-28 16:16:11 +00:00
|
|
|
|
2020-09-18 12:20:33 +00:00
|
|
|
this.label = this.enable?"2D":"3D";
|
2020-09-18 06:38:05 +00:00
|
|
|
}
|
|
|
|
}
|