FarmMapsLib/projects/common-map3d/src/fm-map3d/components/olcs/switch2d3d/switch2d3d.component.ts

52 lines
1.3 KiB
TypeScript
Raw Normal View History

import { Component, OnInit,Input,Host } from '@angular/core';
import { MapComponent } from 'ngx-openlayers';
import OLCesium from 'ol-cesium';
2020-09-18 12:20:33 +00:00
declare var olcs: any;
@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']
})
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;
2021-01-26 08:12:37 +00:00
constructor(private map: MapComponent) {
}
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});
2020-09-18 12:20:33 +00:00
}
synchronize() {
this.synchronizers.forEach((synchronizer) => {
synchronizer.synchronize();
});
}
handleClick(event) {
2020-09-18 12:20:33 +00:00
this.enable = !this.enable;
if(this.enable) {
this.synchronize();
}
this.ol3d.setEnabled(this.enable);
this.label = this.enable?"2D":"3D";
}
}