angular-cesium
Version:
Angular library for working with Cesium.
83 lines • 9.13 kB
JavaScript
import { Component, ElementRef, Input, Renderer2 } from '@angular/core';
import { CesiumService } from '../../services/cesium/cesium.service';
/**
* This is an html implementation.
* The ac-html element must be a child of ac-map element.
* __Usage:__
* ```
* <ac-html [props]="{position: position, show: true}">;
* <p>html element</p>
* </ac-html>
* ```
*/
export class AcHtmlComponent {
constructor(cesiumService, elementRef, renderer) {
this.cesiumService = cesiumService;
this.elementRef = elementRef;
this.renderer = renderer;
this.isDraw = false;
}
setScreenPosition(screenPosition) {
if (screenPosition) {
this.renderer.setStyle(this.elementRef.nativeElement, 'top', `${screenPosition.y}px`);
this.renderer.setStyle(this.elementRef.nativeElement, 'left', `${screenPosition.x}px`);
}
}
ngOnInit() {
this.cesiumService.getMap().getMapContainer().appendChild(this.elementRef.nativeElement);
if (this.props.show === false) {
this.hideElement();
}
}
remove() {
if (this.isDraw) {
this.isDraw = false;
this.cesiumService.getScene().preRender.removeEventListener(this.preRenderEventListener);
this.hideElement();
}
}
hideElement() {
this.renderer.setStyle(this.elementRef.nativeElement, 'display', `none`);
}
add() {
if (!this.isDraw) {
this.isDraw = true;
this.preRenderEventListener = () => {
const screenPosition = Cesium.SceneTransforms.wgs84ToWindowCoordinates(this.cesiumService.getScene(), this.props.position);
this.setScreenPosition(screenPosition);
};
this.renderer.setStyle(this.elementRef.nativeElement, 'display', `block`);
this.cesiumService.getScene().preRender.addEventListener(this.preRenderEventListener);
}
}
ngDoCheck() {
if (this.props.show === undefined || this.props.show) {
this.add();
}
else {
this.remove();
}
}
ngOnDestroy() {
this.remove();
}
}
AcHtmlComponent.decorators = [
{ type: Component, args: [{
selector: 'ac-html',
template: `<ng-content></ng-content>`,
styles: [`:host {
position: absolute;
z-index: 100;
}`]
},] }
];
AcHtmlComponent.ctorParameters = () => [
{ type: CesiumService },
{ type: ElementRef },
{ type: Renderer2 }
];
AcHtmlComponent.propDecorators = {
props: [{ type: Input }]
};
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWMtaHRtbC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9hbmd1bGFyLWNlc2l1bS9zcmMvbGliL2FuZ3VsYXItY2VzaXVtL2NvbXBvbmVudHMvYWMtaHRtbC9hYy1odG1sLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFXLFVBQVUsRUFBRSxLQUFLLEVBQXFCLFNBQVMsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUNwRyxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sc0NBQXNDLENBQUM7QUFFckU7Ozs7Ozs7OztHQVNHO0FBVUgsTUFBTSxPQUFPLGVBQWU7SUFPMUIsWUFBb0IsYUFBNEIsRUFBVSxVQUFzQixFQUFVLFFBQW1CO1FBQXpGLGtCQUFhLEdBQWIsYUFBYSxDQUFlO1FBQVUsZUFBVSxHQUFWLFVBQVUsQ0FBWTtRQUFVLGFBQVEsR0FBUixRQUFRLENBQVc7UUFIckcsV0FBTSxHQUFHLEtBQUssQ0FBQztJQUl2QixDQUFDO0lBRUQsaUJBQWlCLENBQUMsY0FBbUI7UUFDbkMsSUFBSSxjQUFjLEVBQUU7WUFDbEIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxhQUFhLEVBQUUsS0FBSyxFQUFFLEdBQUcsY0FBYyxDQUFDLENBQUMsSUFBSSxDQUFDLENBQUM7WUFDdEYsSUFBSSxDQUFDLFFBQVEsQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxhQUFhLEVBQUUsTUFBTSxFQUFFLEdBQUcsY0FBYyxDQUFDLENBQUMsSUFBSSxDQUFDLENBQUM7U0FDeEY7SUFDSCxDQUFDO0lBRUQsUUFBUTtRQUNOLElBQUksQ0FBQyxhQUFhLENBQUMsTUFBTSxFQUFFLENBQUMsZUFBZSxFQUFFLENBQUMsV0FBVyxDQUFDLElBQUksQ0FBQyxVQUFVLENBQUMsYUFBYSxDQUFDLENBQUM7UUFDekYsSUFBSSxJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksS0FBSyxLQUFLLEVBQUU7WUFDN0IsSUFBSSxDQUFDLFdBQVcsRUFBRSxDQUFDO1NBQ3BCO0lBQ0gsQ0FBQztJQUVELE1BQU07UUFDSixJQUFJLElBQUksQ0FBQyxNQUFNLEVBQUU7WUFDZixJQUFJLENBQUMsTUFBTSxHQUFHLEtBQUssQ0FBQztZQUNwQixJQUFJLENBQUMsYUFBYSxDQUFDLFFBQVEsRUFBRSxDQUFDLFNBQVMsQ0FBQyxtQkFBbUIsQ0FBQyxJQUFJLENBQUMsc0JBQXNCLENBQUMsQ0FBQztZQUN6RixJQUFJLENBQUMsV0FBVyxFQUFFLENBQUM7U0FDcEI7SUFDSCxDQUFDO0lBRUQsV0FBVztRQUNULElBQUksQ0FBQyxRQUFRLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxVQUFVLENBQUMsYUFBYSxFQUFFLFNBQVMsRUFBRSxNQUFNLENBQUMsQ0FBQztJQUMzRSxDQUFDO0lBRUQsR0FBRztRQUNELElBQUksQ0FBQyxJQUFJLENBQUMsTUFBTSxFQUFFO1lBQ2hCLElBQUksQ0FBQyxNQUFNLEdBQUcsSUFBSSxDQUFDO1lBQ25CLElBQUksQ0FBQyxzQkFBc0IsR0FBRyxHQUFHLEVBQUU7Z0JBQ2pDLE1BQU0sY0FBYyxHQUFHLE1BQU0sQ0FBQyxlQUFlLENBQUMsd0JBQXdCLENBQUMsSUFBSSxDQUFDLGFBQWEsQ0FBQyxRQUFRLEVBQUUsRUFDbEcsSUFBSSxDQUFDLEtBQUssQ0FBQyxRQUFRLENBQUMsQ0FBQztnQkFDdkIsSUFBSSxDQUFDLGlCQUFpQixDQUFDLGNBQWMsQ0FBQyxDQUFDO1lBQ3pDLENBQUMsQ0FBQztZQUNGLElBQUksQ0FBQyxRQUFRLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxVQUFVLENBQUMsYUFBYSxFQUFFLFNBQVMsRUFBRSxPQUFPLENBQUMsQ0FBQztZQUMxRSxJQUFJLENBQUMsYUFBYSxDQUFDLFFBQVEsRUFBRSxDQUFDLFNBQVMsQ0FBQyxnQkFBZ0IsQ0FBQyxJQUFJLENBQUMsc0JBQXNCLENBQUMsQ0FBQztTQUN2RjtJQUNILENBQUM7SUFFRCxTQUFTO1FBQ1AsSUFBSSxJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksS0FBSyxTQUFTLElBQUksSUFBSSxDQUFDLEtBQUssQ0FBQyxJQUFJLEVBQUU7WUFDcEQsSUFBSSxDQUFDLEdBQUcsRUFBRSxDQUFDO1NBQ1o7YUFBTTtZQUNMLElBQUksQ0FBQyxNQUFNLEVBQUUsQ0FBQztTQUNmO0lBQ0gsQ0FBQztJQUVELFdBQVc7UUFDVCxJQUFJLENBQUMsTUFBTSxFQUFFLENBQUM7SUFDaEIsQ0FBQzs7O1lBbkVGLFNBQVMsU0FBQztnQkFDVCxRQUFRLEVBQUUsU0FBUztnQkFDbkIsUUFBUSxFQUFFLDJCQUEyQjt5QkFDNUI7OztNQUdMO2FBQ0w7OztZQXBCUSxhQUFhO1lBRE8sVUFBVTtZQUE0QixTQUFTOzs7b0JBeUJ6RSxLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBEb0NoZWNrLCBFbGVtZW50UmVmLCBJbnB1dCwgT25EZXN0cm95LCBPbkluaXQsIFJlbmRlcmVyMiB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBDZXNpdW1TZXJ2aWNlIH0gZnJvbSAnLi4vLi4vc2VydmljZXMvY2VzaXVtL2Nlc2l1bS5zZXJ2aWNlJztcclxuXHJcbi8qKlxyXG4gKiAgVGhpcyBpcyBhbiBodG1sIGltcGxlbWVudGF0aW9uLlxyXG4gKiAgVGhlIGFjLWh0bWwgZWxlbWVudCBtdXN0IGJlIGEgY2hpbGQgb2YgYWMtbWFwIGVsZW1lbnQuXHJcbiAqICBfX1VzYWdlOl9fXHJcbiAqICBgYGBcclxuICogIDxhYy1odG1sIFtwcm9wc109XCJ7cG9zaXRpb246IHBvc2l0aW9uLCBzaG93OiB0cnVlfVwiPjtcclxuICogICAgPHA+aHRtbCBlbGVtZW50PC9wPlxyXG4gKiAgPC9hYy1odG1sPlxyXG4gKiAgYGBgXHJcbiAqL1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICdhYy1odG1sJyxcclxuICB0ZW1wbGF0ZTogYDxuZy1jb250ZW50PjwvbmctY29udGVudD5gLFxyXG4gIHN0eWxlczogW2A6aG9zdCB7XHJcbiAgICAgICAgICAgICAgICBwb3NpdGlvbjogYWJzb2x1dGU7XHJcbiAgICAgICAgICAgICAgICB6LWluZGV4OiAxMDA7XHJcblx0XHRcdFx0fWBdXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBBY0h0bWxDb21wb25lbnQgaW1wbGVtZW50cyBEb0NoZWNrLCBPbkRlc3Ryb3ksIE9uSW5pdCB7XHJcblxyXG5cclxuICBASW5wdXQoKSBwcm9wczogYW55O1xyXG4gIHByaXZhdGUgaXNEcmF3ID0gZmFsc2U7XHJcbiAgcHJlUmVuZGVyRXZlbnRMaXN0ZW5lcjogKCkgPT4gdm9pZDtcclxuXHJcbiAgY29uc3RydWN0b3IocHJpdmF0ZSBjZXNpdW1TZXJ2aWNlOiBDZXNpdW1TZXJ2aWNlLCBwcml2YXRlIGVsZW1lbnRSZWY6IEVsZW1lbnRSZWYsIHByaXZhdGUgcmVuZGVyZXI6IFJlbmRlcmVyMikge1xyXG4gIH1cclxuXHJcbiAgc2V0U2NyZWVuUG9zaXRpb24oc2NyZWVuUG9zaXRpb246IGFueSkge1xyXG4gICAgaWYgKHNjcmVlblBvc2l0aW9uKSB7XHJcbiAgICAgIHRoaXMucmVuZGVyZXIuc2V0U3R5bGUodGhpcy5lbGVtZW50UmVmLm5hdGl2ZUVsZW1lbnQsICd0b3AnLCBgJHtzY3JlZW5Qb3NpdGlvbi55fXB4YCk7XHJcbiAgICAgIHRoaXMucmVuZGVyZXIuc2V0U3R5bGUodGhpcy5lbGVtZW50UmVmLm5hdGl2ZUVsZW1lbnQsICdsZWZ0JywgYCR7c2NyZWVuUG9zaXRpb24ueH1weGApO1xyXG4gICAgfVxyXG4gIH1cclxuXHJcbiAgbmdPbkluaXQoKTogdm9pZCB7XHJcbiAgICB0aGlzLmNlc2l1bVNlcnZpY2UuZ2V0TWFwKCkuZ2V0TWFwQ29udGFpbmVyKCkuYXBwZW5kQ2hpbGQodGhpcy5lbGVtZW50UmVmLm5hdGl2ZUVsZW1lbnQpO1xyXG4gICAgaWYgKHRoaXMucHJvcHMuc2hvdyA9PT0gZmFsc2UpIHtcclxuICAgICAgdGhpcy5oaWRlRWxlbWVudCgpO1xyXG4gICAgfVxyXG4gIH1cclxuXHJcbiAgcmVtb3ZlKCkge1xyXG4gICAgaWYgKHRoaXMuaXNEcmF3KSB7XHJcbiAgICAgIHRoaXMuaXNEcmF3ID0gZmFsc2U7XHJcbiAgICAgIHRoaXMuY2VzaXVtU2VydmljZS5nZXRTY2VuZSgpLnByZVJlbmRlci5yZW1vdmVFdmVudExpc3RlbmVyKHRoaXMucHJlUmVuZGVyRXZlbnRMaXN0ZW5lcik7XHJcbiAgICAgIHRoaXMuaGlkZUVsZW1lbnQoKTtcclxuICAgIH1cclxuICB9XHJcblxyXG4gIGhpZGVFbGVtZW50KCkge1xyXG4gICAgdGhpcy5yZW5kZXJlci5zZXRTdHlsZSh0aGlzLmVsZW1lbnRSZWYubmF0aXZlRWxlbWVudCwgJ2Rpc3BsYXknLCBgbm9uZWApO1xyXG4gIH1cclxuXHJcbiAgYWRkKCkge1xyXG4gICAgaWYgKCF0aGlzLmlzRHJhdykge1xyXG4gICAgICB0aGlzLmlzRHJhdyA9IHRydWU7XHJcbiAgICAgIHRoaXMucHJlUmVuZGVyRXZlbnRMaXN0ZW5lciA9ICgpID0+IHtcclxuICAgICAgICBjb25zdCBzY3JlZW5Qb3NpdGlvbiA9IENlc2l1bS5TY2VuZVRyYW5zZm9ybXMud2dzODRUb1dpbmRvd0Nvb3JkaW5hdGVzKHRoaXMuY2VzaXVtU2VydmljZS5nZXRTY2VuZSgpLFxyXG4gICAgICAgICAgdGhpcy5wcm9wcy5wb3NpdGlvbik7XHJcbiAgICAgICAgdGhpcy5zZXRTY3JlZW5Qb3NpdGlvbihzY3JlZW5Qb3NpdGlvbik7XHJcbiAgICAgIH07XHJcbiAgICAgIHRoaXMucmVuZGVyZXIuc2V0U3R5bGUodGhpcy5lbGVtZW50UmVmLm5hdGl2ZUVsZW1lbnQsICdkaXNwbGF5JywgYGJsb2NrYCk7XHJcbiAgICAgIHRoaXMuY2VzaXVtU2VydmljZS5nZXRTY2VuZSgpLnByZVJlbmRlci5hZGRFdmVudExpc3RlbmVyKHRoaXMucHJlUmVuZGVyRXZlbnRMaXN0ZW5lcik7XHJcbiAgICB9XHJcbiAgfVxyXG5cclxuICBuZ0RvQ2hlY2soKSB7XHJcbiAgICBpZiAodGhpcy5wcm9wcy5zaG93ID09PSB1bmRlZmluZWQgfHwgdGhpcy5wcm9wcy5zaG93KSB7XHJcbiAgICAgIHRoaXMuYWRkKCk7XHJcbiAgICB9IGVsc2Uge1xyXG4gICAgICB0aGlzLnJlbW92ZSgpO1xyXG4gICAgfVxyXG4gIH1cclxuXHJcbiAgbmdPbkRlc3Ryb3koKTogdm9pZCB7XHJcbiAgICB0aGlzLnJlbW92ZSgpO1xyXG4gIH1cclxufVxyXG4iXX0=