Make zoom-to padding configurable per route
All checks were successful
FarmMaps.Develop/FarmMapsLib/pipeline/head This commit looks good

This commit is contained in:
Willem Dantuma
2021-07-21 11:17:15 +02:00
parent 8d3c098f4e
commit 519e5c9032
3 changed files with 45 additions and 32 deletions

View File

@@ -1,4 +1,5 @@
import { Component, Host, Input, OnInit, OnChanges, SimpleChanges, forwardRef } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { ViewComponent, MapComponent } from 'ngx-openlayers';
@@ -9,12 +10,24 @@ import { ViewComponent, MapComponent } from 'ngx-openlayers';
export class ZoomToExtentComponent implements OnChanges {
view: ViewComponent;
map: MapComponent;
paddingTop: number = 0;
paddingLeft: number = 0;
paddingBottom: number = 0;
paddingRight: number = 0;
@Input() extent: number[];
@Input() animate: boolean = false;
constructor(@Host() view: ViewComponent, @Host() map: MapComponent) {
constructor(@Host() view: ViewComponent, @Host() map: MapComponent,route: ActivatedRoute ) {
this.view = view;
this.map = map;
if(route && route.snapshot && route.snapshot.data && route.snapshot.data["fm-map-zoom-to-extent"]) {
let params = route.snapshot.data["fm-map-zoom-to-extent"];
this.paddingTop = params["padding-top"] ? params["padding-top"] : 0;
this.paddingBottom = params["padding-bottom"] ? params["padding-bottom"] : 0;
this.paddingLeft = params["padding-left"] ? params["padding-left"] : 0;
this.paddingRight = params["padding-right"] ? params["padding-right"] : 0;
}
}
ngOnChanges(changes: SimpleChanges) {
@@ -31,7 +44,7 @@ export class ZoomToExtentComponent implements OnChanges {
bottom = 5 * rem;
left = 23 * rem;
}
options.padding = [top, right, bottom, left];
options.padding = [top + (this.paddingTop*rem), right+ (this.paddingRight*rem), bottom + (this.paddingBottom*rem), left+ (this.paddingLeft*rem)];
if (this.animate) options["duration"] = 1000;
this.view.instance.fit(this.extent, options);
}