From c2490b017f3a3df39b684b6ab5b45cc4d01ac900 Mon Sep 17 00:00:00 2001 From: Filip Leitner Date: Thu, 11 Apr 2024 09:37:34 +0200 Subject: [PATCH] perf(cesium): Reduce usage of some unnecessary sync callbacks --- .../src/hscesium-layers.service.ts | 5 -- .../hslayers-cesium/src/hscesium.component.ts | 34 ++++++++---- .../hslayers-cesium/src/hscesium.service.ts | 54 ++++++++----------- 3 files changed, 47 insertions(+), 46 deletions(-) diff --git a/projects/hslayers-cesium/src/hscesium-layers.service.ts b/projects/hslayers-cesium/src/hscesium-layers.service.ts index cf81740b87..7cd1d6b62c 100644 --- a/projects/hslayers-cesium/src/hscesium-layers.service.ts +++ b/projects/hslayers-cesium/src/hscesium-layers.service.ts @@ -136,11 +136,6 @@ export class HsCesiumLayersService { }; } - /** - * @param version - - * @param srs - - * @param crs - - */ getProjectFromVersion(version, srs, crs) { if (version == '1.1.1') { return srs; diff --git a/projects/hslayers-cesium/src/hscesium.component.ts b/projects/hslayers-cesium/src/hscesium.component.ts index 48c341ce2b..14c1cd83ff 100644 --- a/projects/hslayers-cesium/src/hscesium.component.ts +++ b/projects/hslayers-cesium/src/hscesium.component.ts @@ -1,4 +1,4 @@ -import {AfterViewInit, Component} from '@angular/core'; +import {AfterViewInit, Component, DestroyRef} from '@angular/core'; import {HS_PRMS, HsShareUrlService} from 'hslayers-ng/components/share'; import {HsCoreService} from 'hslayers-ng/services/core'; @@ -10,15 +10,25 @@ import {HsToolbarPanelContainerService} from 'hslayers-ng/services/panels'; import {HsCesiumService} from './hscesium.service'; import {HsToggleViewComponent} from './toggle-view/toggle-view.component'; +import {filter} from 'rxjs'; +import {takeUntilDestroyed} from '@angular/core/rxjs-interop'; @Component({ selector: 'hs-cesium', templateUrl: './hscesium.component.html', styles: ` - .hs-cesium-container { - height: 100%; margin: 0; padding: 0; overflow: hidden; position: absolute; left: 0; top: 0; width: 100%; - margin-right: 0; - }`, + .hs-cesium-container { + height: 100%; + margin: 0; + padding: 0; + overflow: hidden; + position: absolute; + left: 0; + top: 0; + width: 100%; + margin-right: 0; + } + `, }) export class HslayersCesiumComponent implements AfterViewInit { app = 'default'; @@ -31,6 +41,7 @@ export class HslayersCesiumComponent implements AfterViewInit { private hsToolbarPanelContainerService: HsToolbarPanelContainerService, public HsEventBusService: HsEventBusService, public HsLayoutService: HsLayoutService, + private DestroyRef: DestroyRef, ) {} ngAfterViewInit(): void { @@ -54,9 +65,14 @@ export class HslayersCesiumComponent implements AfterViewInit { this.HsCesiumService.dimensionChanged(data.layer, data.dimension), ); - this.HsEventBusService.sizeChanges.subscribe((size) => - this.HsCesiumService.resize(size), - ); - this.HsCesiumService.resize(); + this.HsEventBusService.sizeChanges + .pipe( + takeUntilDestroyed(this.DestroyRef), + /** + * Resize immidiatelly only in case cesium is visible + */ + filter((size) => this.HsCesiumService.visible), + ) + .subscribe((size) => this.HsCesiumService.resize(size)); } } diff --git a/projects/hslayers-cesium/src/hscesium.service.ts b/projects/hslayers-cesium/src/hscesium.service.ts index 0f76a7dd17..5ecdfaec79 100644 --- a/projects/hslayers-cesium/src/hscesium.service.ts +++ b/projects/hslayers-cesium/src/hscesium.service.ts @@ -106,29 +106,15 @@ export class HsCesiumService { this.hsLog.error('Please set HsConfig.default_view'); } - //TODO: research if this must be used or ignored - const bing = BingMapsImageryProvider.fromUrl('//dev.virtualearth.net', { - key: this.BING_KEY, - mapStyle: BingMapsStyle.AERIAL, - }); - const viewer = new Viewer( this.HsLayoutService.contentWrapper.querySelector( '.hs-cesium-container', ), { - timeline: this.HsCesiumConfig.cesiumTimeline - ? this.HsCesiumConfig.cesiumTimeline - : false, - animation: this.HsCesiumConfig.cesiumAnimation - ? this.HsCesiumConfig.cesiumAnimation - : false, - creditContainer: this.HsCesiumConfig.creditContainer - ? this.HsCesiumConfig.creditContainer - : undefined, - infoBox: this.HsCesiumConfig.cesiumInfoBox - ? this.HsCesiumConfig.cesiumInfoBox - : false, + timeline: this.HsCesiumConfig.cesiumTimeline ?? false, + animation: this.HsCesiumConfig.cesiumAnimation ?? false, + creditContainer: this.HsCesiumConfig.creditContainer ?? undefined, + infoBox: this.HsCesiumConfig.cesiumInfoBox ?? false, terrainProvider: terrainProvider, baseLayer: this.HsCesiumConfig.imageryProvider ? new ImageryLayer(this.HsCesiumConfig.imageryProvider, {}) @@ -153,10 +139,8 @@ export class HsCesiumService { }, ); - viewer.scene.debugShowFramesPerSecond = this.HsCesiumConfig - .cesiumDebugShowFramesPerSecond - ? this.HsCesiumConfig.cesiumDebugShowFramesPerSecond - : false; + viewer.scene.debugShowFramesPerSecond = + this.HsCesiumConfig.cesiumDebugShowFramesPerSecond ?? false; viewer.scene.globe.enableLighting = this.getShadowMode(); viewer.scene.globe.shadows = this.getShadowMode(); viewer.scene.globe.terrainExaggeration = @@ -207,15 +191,9 @@ export class HsCesiumService { } } - this.HsEventBusService.mapExtentChanges - .pipe(takeUntil(this.end)) - .subscribe(() => { - const view = this.HsMapService.getMap().getView(); - if (this.HsMapService.visible) { - this.HsCesiumCameraService.setExtentEqualToOlExtent(view); - } - }); - + /** + * UNUSED:No trigger found in HSL or HSL-Cesium + */ this.HsEventBusService.zoomTo .pipe(takeUntil(this.end)) .subscribe((data) => { @@ -302,7 +280,11 @@ export class HsCesiumService { this.HsCesiumLayersService.removeLayersWithOldParams(); } - resize(size?) { + /** + * Resize cesium container + * @param size Size of OL map container + */ + resize(size: {height: number; width: number}) { if (size == undefined) { return; } @@ -351,7 +333,15 @@ export class HsCesiumService { this.cesiumDisabled(); this.hsCoreService.updateMapSize(); } else { + const view = this.HsMapService.getMap().getView(); + if (this.HsMapService.visible) { + this.HsCesiumCameraService.setExtentEqualToOlExtent(view); + } this.init(); + this.resize({ + width: this.HsMapService.mapElement.offsetWidth, + height: this.HsMapService.mapElement.offsetHeight, + }); } this.HsEventBusService.mapLibraryChanges.next( this.visible ? 'cesium' : 'ol',