From 9e029edfe69bef84a20f885eca1c33a6dd0080ca Mon Sep 17 00:00:00 2001 From: Damien Marest Date: Wed, 9 Aug 2017 16:06:28 +0200 Subject: [PATCH] feat(SourceTileWMTSComponent): add wmts source component and wmts grid tile component grid tile wmts has to be a child component of wms source to be compliant with Openlayers architecture. As the tileGrid parameter of source WMTS is mandatory, source intance is created after content initialization with tile grid child component instance as value for tileGrid --- .gitignore | 3 + example/package.json | 2 +- src/components/index.ts | 1 + src/components/sources/index.ts | 1 + src/components/sources/tilewmts.component.ts | 59 ++++++++++++++++++++ src/components/tilegridwmts.component.ts | 23 ++++++++ src/components/view.component.ts | 3 +- src/index.ts | 6 +- 8 files changed, 94 insertions(+), 4 deletions(-) create mode 100644 src/components/sources/tilewmts.component.ts create mode 100644 src/components/tilegridwmts.component.ts diff --git a/.gitignore b/.gitignore index dcd0a308..cf0ce16e 100644 --- a/.gitignore +++ b/.gitignore @@ -2,6 +2,9 @@ node_modules/* npm-debug.log +# compiled output +/dist + # JetBrains .idea .project diff --git a/example/package.json b/example/package.json index ef894058..ac736a62 100644 --- a/example/package.json +++ b/example/package.json @@ -23,7 +23,7 @@ "core-js": "^2.4.1", "rxjs": "^5.1.0", "zone.js": "^0.8.4", - "angular2-openlayers": "^0.6.5" + "angular2-openlayers": "0.6.8" }, "devDependencies": { "@angular/cli": "1.0.4", diff --git a/src/components/index.ts b/src/components/index.ts index 77b84546..f2b216fc 100644 --- a/src/components/index.ts +++ b/src/components/index.ts @@ -14,4 +14,5 @@ export * from './geometry.components'; export * from './map.component'; export * from './overlay.component'; export * from './tilegrid.component'; +export * from './tilegridwmts.component'; export * from './view.component'; diff --git a/src/components/sources/index.ts b/src/components/sources/index.ts index 4fb2158b..56cc7d27 100644 --- a/src/components/sources/index.ts +++ b/src/components/sources/index.ts @@ -6,3 +6,4 @@ export * from './vectortile.component'; export * from './xyz.component'; export * from './tilewms.component'; export * from './geojson.component'; +export * from './tilewmts.component'; \ No newline at end of file diff --git a/src/components/sources/tilewmts.component.ts b/src/components/sources/tilewmts.component.ts new file mode 100644 index 00000000..d1fc7f4d --- /dev/null +++ b/src/components/sources/tilewmts.component.ts @@ -0,0 +1,59 @@ +import { Component, Host, Input, OnInit, forwardRef, AfterContentInit , ContentChild } from '@angular/core'; +import { + TileLoadFunctionType, + AttributionLike, + tilegrid, + ProjectionLike, + source, + ImageTile, + TileCoord, + Tile +} from 'openlayers'; +import { LayerTileComponent } from '../layers'; +import { SourceComponent } from './source.component'; +import { TileGridWMTSComponent } from '../tilegridwmts.component'; + +@Component({ + selector: 'aol-source-tilewmts', + template: ``, + providers: [ + { provide: SourceComponent, useExisting: forwardRef(() => SourceTileWMTSComponent) } + ] +}) +export class SourceTileWMTSComponent extends SourceComponent implements AfterContentInit { + + instance: source.WMTS; + @Input() cacheSize?: number; + @Input() crossOrigin?: (string); + @Input() logo?: (string | olx.LogoOptions); + @Input() tileGrid: tilegrid.WMTS; + @Input() projection: ProjectionLike; + @Input() reprojectionErrorThreshold?: number; + @Input() requestEncoding?: (source.WMTSRequestEncoding | string); + @Input() layer: string; + @Input() style: string; + @Input() tileClass?: ((n: ImageTile, coords: TileCoord, state: Tile.State, s1: string, s2: string, type: TileLoadFunctionType) => any); + @Input() tilePixelRatio?: number; + @Input() version?: string; + @Input() format?: string; + @Input() matrixSet: string; + @Input() dimensions?: GlobalObject; + @Input() url?: string; + @Input() tileLoadFunction?: TileLoadFunctionType; + @Input() urls?: string[]; + @Input() wrapX?: boolean; + + @ContentChild(TileGridWMTSComponent) tileGridWMTS: TileGridWMTSComponent; + + constructor( @Host() layer: LayerTileComponent) { + super(layer); + } + + ngAfterContentInit(): void { + if (this.tileGridWMTS) { + this.tileGrid = this.tileGridWMTS.instance; + this.instance = new source.WMTS(this); + this.host.instance.setSource(this.instance); + } + } +} diff --git a/src/components/tilegridwmts.component.ts b/src/components/tilegridwmts.component.ts new file mode 100644 index 00000000..ed4cab16 --- /dev/null +++ b/src/components/tilegridwmts.component.ts @@ -0,0 +1,23 @@ +import { Component, Input, OnInit } from '@angular/core'; +import { tilegrid, Extent, Size, Coordinate } from 'openlayers'; +import { TileGridComponent } from './tilegrid.component'; + +@Component({ + selector: 'aol-tilegrid-wmts', + template: '' +}) +export class TileGridWMTSComponent extends TileGridComponent implements OnInit { + instance: tilegrid.WMTS; + + @Input() origin?: Coordinate; + @Input() origins?: Coordinate[]; + @Input() resolutions: number[]; + @Input() matrixIds: string[]; + @Input() sizes?: Size[]; + @Input() tileSizes?: ((number | Size)[]); + @Input() widths?: number[]; + + ngOnInit() { + this.instance = new tilegrid.WMTS(this); + } +} diff --git a/src/components/view.component.ts b/src/components/view.component.ts index ff79d619..0e21cae1 100644 --- a/src/components/view.component.ts +++ b/src/components/view.component.ts @@ -1,5 +1,5 @@ import { Component, Input, OnInit, OnChanges, OnDestroy, SimpleChanges } from '@angular/core'; -import { View, Extent } from 'openlayers'; +import { View, Extent, Coordinate } from 'openlayers'; import { MapComponent } from './map.component'; @Component({ @@ -22,6 +22,7 @@ export class ViewComponent implements OnInit, OnChanges, OnDestroy { @Input() rotation: number; @Input() zoom: number; @Input() zoomFactor: number; + @Input() center: Coordinate; constructor(private host: MapComponent) { } diff --git a/src/index.ts b/src/index.ts index 68739b61..f838048d 100644 --- a/src/index.ts +++ b/src/index.ts @@ -4,7 +4,7 @@ import { MapComponent, ViewComponent, LayerTileComponent, LayerVectorComponent, LayerVectorTileComponent, SourceBingmapsComponent, SourceOsmComponent, SourceVectorComponent, SourceVectorTileComponent, SourceXYZComponent, SourceTileWMSComponent, - SourceGeoJSONComponent, FeatureComponent, + SourceGeoJSONComponent, SourceTileWMTSComponent, FeatureComponent, GeometryLinestringComponent, GeometryPointComponent, GeometryPolygonComponent, CollectionCoordinatesComponent, CoordinateComponent, StyleCircleComponent, StyleComponent, StyleFillComponent, StyleIconComponent, StyleStrokeComponent, StyleTextComponent, @@ -12,7 +12,7 @@ import { ControlOverviewMapComponent, ControlRotateComponent, ControlScaleLineComponent, ControlZoomComponent, ControlZoomSliderComponent, ControlZoomToExtentComponent, DefaultControlComponent, ControlComponent, FormatMVTComponent, - TileGridComponent, + TileGridComponent, TileGridWMTSComponent, DefaultInteractionComponent, DragRotateInteractionComponent, DragRotateAndZoomInteractionComponent, DoubleClickZoomInteractionComponent, DragAndDropInteractionComponent, DragBoxInteractionComponent, DragPanInteractionComponent, DragZoomInteractionComponent, MouseWheelZoomInteractionComponent, @@ -40,6 +40,7 @@ const COMPONENTS = [ SourceXYZComponent, SourceVectorTileComponent, SourceTileWMSComponent, + SourceTileWMTSComponent, SourceGeoJSONComponent, FeatureComponent, GeometryLinestringComponent, @@ -69,6 +70,7 @@ const COMPONENTS = [ FormatMVTComponent, TileGridComponent, + TileGridWMTSComponent, DefaultInteractionComponent, DoubleClickZoomInteractionComponent,