diff --git a/angular.json b/angular.json index 5e2771cd..6717f01e 100644 --- a/angular.json +++ b/angular.json @@ -48,7 +48,7 @@ ], "styles": [ "src/styles.css", - "projects/ngx-openlayers/node_modules/openlayers/dist/ol.css" + "projects/ngx-openlayers/node_modules/ol/ol.css" ], "scripts": [] }, diff --git a/projects/ngx-openlayers/ng-package.json b/projects/ngx-openlayers/ng-package.json index f44c934e..05b1e049 100644 --- a/projects/ngx-openlayers/ng-package.json +++ b/projects/ngx-openlayers/ng-package.json @@ -3,7 +3,7 @@ "dest": "../../dist/ngx-openlayers", "deleteDestPath": false, "whitelistedNonPeerDependencies": [ - "openlayers", "@types/openlayers" + "ol", "@angular/core" ], "lib": { "entryFile": "src/public_api.ts" diff --git a/projects/ngx-openlayers/package.json b/projects/ngx-openlayers/package.json index 4f42c3a2..4e295145 100644 --- a/projects/ngx-openlayers/package.json +++ b/projects/ngx-openlayers/package.json @@ -1,10 +1,11 @@ { "name": "ngx-openlayers", "version": "0.0.1", + "dependencies": { + "ol": "^5.1.3" + }, "peerDependencies": { - "@angular/common": "^6.0.0-rc.0 || ^6.0.0", - "@angular/core": "^6.0.0-rc.0 || ^6.0.0", - "@types/openlayers": "4.3.x || 4.4.x", - "openlayers": "4.3.x || 4.4.x" + "@angular/common": "^6.0.0", + "@angular/core": "^6.0.0" } } diff --git a/projects/ngx-openlayers/src/lib/controls/attribution.component.ts b/projects/ngx-openlayers/src/lib/controls/attribution.component.ts index 2997f9bc..6de9ed71 100644 --- a/projects/ngx-openlayers/src/lib/controls/attribution.component.ts +++ b/projects/ngx-openlayers/src/lib/controls/attribution.component.ts @@ -1,5 +1,5 @@ import { Component, ElementRef, Input, OnDestroy, OnInit } from '@angular/core'; -import { control } from 'openlayers'; +import { Attribution } from 'ol/control'; import { MapComponent } from '../map.component'; @Component({ @@ -8,7 +8,7 @@ import { MapComponent } from '../map.component'; }) export class ControlAttributionComponent implements OnInit, OnDestroy { public componentType = 'control'; - instance: control.Attribution; + instance: Attribution; target: Element; @Input() collapsible: boolean; @@ -18,7 +18,7 @@ export class ControlAttributionComponent implements OnInit, OnDestroy { ngOnInit() { this.target = this.element.nativeElement; // console.log('ol.control.Attribution init: ', this); - this.instance = new control.Attribution(this); + this.instance = new Attribution(this); this.map.instance.addControl(this.instance); } diff --git a/projects/ngx-openlayers/src/lib/controls/control.component.ts b/projects/ngx-openlayers/src/lib/controls/control.component.ts index ea19e14c..b93a8767 100644 --- a/projects/ngx-openlayers/src/lib/controls/control.component.ts +++ b/projects/ngx-openlayers/src/lib/controls/control.component.ts @@ -1,5 +1,5 @@ import { Component, ContentChild, OnDestroy, OnInit } from '@angular/core'; -import { control } from 'openlayers'; +import { Control } from 'ol/control'; import { MapComponent } from '../map.component'; import { ContentComponent } from '../content.component'; @@ -9,7 +9,7 @@ import { ContentComponent } from '../content.component'; }) export class ControlComponent implements OnInit, OnDestroy { public componentType = 'control'; - instance: control.Control; + instance: Control; element: Element; @ContentChild(ContentComponent) content: ContentComponent; @@ -19,7 +19,7 @@ export class ControlComponent implements OnInit, OnDestroy { ngOnInit() { if (this.content) { this.element = this.content.elementRef.nativeElement; - this.instance = new control.Control(this); + this.instance = new Control(this); this.map.instance.addControl(this.instance); } } diff --git a/projects/ngx-openlayers/src/lib/controls/default.component.ts b/projects/ngx-openlayers/src/lib/controls/default.component.ts index 6798cc91..b3d20ad3 100644 --- a/projects/ngx-openlayers/src/lib/controls/default.component.ts +++ b/projects/ngx-openlayers/src/lib/controls/default.component.ts @@ -1,5 +1,6 @@ import { Component, OnDestroy, OnInit, Input } from '@angular/core'; -import { control, Collection } from 'openlayers'; +import { Control, defaults } from 'ol/control'; +import { Collection } from 'ol'; import { MapComponent } from '../map.component'; @Component({ @@ -7,25 +8,25 @@ import { MapComponent } from '../map.component'; template: '', }) export class DefaultControlComponent implements OnInit, OnDestroy { - instance: Collection; + instance: Collection; @Input() attribution: boolean; @Input() - attributionOptions: olx.control.AttributionOptions; + attributionOptions: any; // TODO: olx.control.AttributionOptions; @Input() rotate: boolean; @Input() - rotateOptions: olx.control.RotateOptions; + rotateOptions: any; // TODO: olx.control.RotateOptions; @Input() zoom: boolean; @Input() - zoomOptions: olx.control.ZoomOptions; + zoomOptions: any; // TODO: olx.control.ZoomOptions; constructor(private map: MapComponent) {} ngOnInit() { // console.log('ol.control.defaults init: ', this); - this.instance = control.defaults(this); + this.instance = defaults(this); this.instance.forEach(c => this.map.instance.addControl(c)); } diff --git a/projects/ngx-openlayers/src/lib/controls/fullscreen.component.ts b/projects/ngx-openlayers/src/lib/controls/fullscreen.component.ts index 8f2c4cb5..e7d558f1 100644 --- a/projects/ngx-openlayers/src/lib/controls/fullscreen.component.ts +++ b/projects/ngx-openlayers/src/lib/controls/fullscreen.component.ts @@ -1,5 +1,5 @@ import { Component, Input, OnDestroy, OnInit } from '@angular/core'; -import { control } from 'openlayers'; +import { FullScreen } from 'ol/control'; import { MapComponent } from '../map.component'; @Component({ @@ -7,7 +7,7 @@ import { MapComponent } from '../map.component'; template: ``, }) export class ControlFullScreenComponent implements OnInit, OnDestroy { - instance: control.FullScreen; + instance: FullScreen; @Input() className: string; @@ -25,7 +25,7 @@ export class ControlFullScreenComponent implements OnInit, OnDestroy { } ngOnInit() { - this.instance = new control.FullScreen(this); + this.instance = new FullScreen(this); this.map.instance.addControl(this.instance); } diff --git a/projects/ngx-openlayers/src/lib/controls/mouseposition.component.ts b/projects/ngx-openlayers/src/lib/controls/mouseposition.component.ts index 3cf4a6b2..e2570dae 100644 --- a/projects/ngx-openlayers/src/lib/controls/mouseposition.component.ts +++ b/projects/ngx-openlayers/src/lib/controls/mouseposition.component.ts @@ -1,15 +1,16 @@ import { Component, ElementRef, Input, OnDestroy, OnInit } from '@angular/core'; -import { control, CoordinateFormatType, ProjectionLike } from 'openlayers'; +import MousePosition from 'ol/control/MousePosition'; import { MapComponent } from '../map.component'; +import { CoordinateFormat, ProjectionLike } from '../../ol-models'; @Component({ selector: 'aol-control-mouseposition', template: ``, }) export class ControlMousePositionComponent implements OnInit, OnDestroy { - instance: control.MousePosition; + instance: MousePosition; @Input() - coordinateFormat: CoordinateFormatType; + coordinateFormat: CoordinateFormat; @Input() projection: ProjectionLike; target: Element; @@ -19,7 +20,7 @@ export class ControlMousePositionComponent implements OnInit, OnDestroy { ngOnInit() { this.target = this.element.nativeElement; // console.log('ol.control.MousePosition init: ', this); - this.instance = new control.MousePosition(this); + this.instance = new MousePosition(this); this.map.instance.addControl(this.instance); } diff --git a/projects/ngx-openlayers/src/lib/controls/overviewmap.component.ts b/projects/ngx-openlayers/src/lib/controls/overviewmap.component.ts index c8ee56a6..968f64cf 100644 --- a/projects/ngx-openlayers/src/lib/controls/overviewmap.component.ts +++ b/projects/ngx-openlayers/src/lib/controls/overviewmap.component.ts @@ -1,5 +1,7 @@ import { Component, Input, OnDestroy, OnInit } from '@angular/core'; -import { control, View, layer } from 'openlayers'; +import { Layer } from 'ol/layer'; +import { View } from 'ol'; +import { OverviewMap } from 'ol/control'; import { MapComponent } from '../map.component'; @Component({ @@ -7,7 +9,7 @@ import { MapComponent } from '../map.component'; template: ``, }) export class ControlOverviewMapComponent implements OnInit, OnDestroy { - instance: control.OverviewMap; + instance: OverviewMap; @Input() collapsed: boolean; @Input() @@ -17,7 +19,7 @@ export class ControlOverviewMapComponent implements OnInit, OnDestroy { @Input() label: string; @Input() - layers: layer.Layer[]; + layers: Layer[]; @Input() target: Element; @Input() @@ -30,7 +32,7 @@ export class ControlOverviewMapComponent implements OnInit, OnDestroy { } ngOnInit() { - this.instance = new control.OverviewMap(this); + this.instance = new OverviewMap(this); this.map.instance.addControl(this.instance); } diff --git a/projects/ngx-openlayers/src/lib/controls/rotate.component.ts b/projects/ngx-openlayers/src/lib/controls/rotate.component.ts index 3c593341..10b32317 100644 --- a/projects/ngx-openlayers/src/lib/controls/rotate.component.ts +++ b/projects/ngx-openlayers/src/lib/controls/rotate.component.ts @@ -1,5 +1,5 @@ import { Component, Input, OnDestroy, OnInit } from '@angular/core'; -import { control } from 'openlayers'; +import { Rotate } from 'ol/control'; import { MapComponent } from '../map.component'; @Component({ @@ -7,7 +7,7 @@ import { MapComponent } from '../map.component'; template: ``, }) export class ControlRotateComponent implements OnInit, OnDestroy { - instance: control.Rotate; + instance: Rotate; @Input() className: string; @@ -25,7 +25,7 @@ export class ControlRotateComponent implements OnInit, OnDestroy { } ngOnInit() { - this.instance = new control.Rotate(this); + this.instance = new Rotate(this); this.map.instance.addControl(this.instance); } diff --git a/projects/ngx-openlayers/src/lib/controls/scaleline.component.ts b/projects/ngx-openlayers/src/lib/controls/scaleline.component.ts index d3ca5648..92b42989 100644 --- a/projects/ngx-openlayers/src/lib/controls/scaleline.component.ts +++ b/projects/ngx-openlayers/src/lib/controls/scaleline.component.ts @@ -1,5 +1,5 @@ import { Component, Input, OnDestroy, OnInit } from '@angular/core'; -import { control } from 'openlayers'; +import { ScaleLine } from 'ol/control'; import { MapComponent } from '../map.component'; @Component({ @@ -7,7 +7,7 @@ import { MapComponent } from '../map.component'; template: ``, }) export class ControlScaleLineComponent implements OnInit, OnDestroy { - instance: control.ScaleLine; + instance: ScaleLine; @Input() units: string; @@ -16,7 +16,7 @@ export class ControlScaleLineComponent implements OnInit, OnDestroy { } ngOnInit() { - this.instance = new control.ScaleLine(this); + this.instance = new ScaleLine(this); this.map.instance.addControl(this.instance); } diff --git a/projects/ngx-openlayers/src/lib/controls/zoom.component.ts b/projects/ngx-openlayers/src/lib/controls/zoom.component.ts index a6c53b9e..38d9a48f 100644 --- a/projects/ngx-openlayers/src/lib/controls/zoom.component.ts +++ b/projects/ngx-openlayers/src/lib/controls/zoom.component.ts @@ -1,5 +1,5 @@ import { Component, Input, OnDestroy, OnInit } from '@angular/core'; -import { control } from 'openlayers'; +import { Zoom } from 'ol/control'; import { MapComponent } from '../map.component'; @Component({ @@ -7,7 +7,7 @@ import { MapComponent } from '../map.component'; template: ``, }) export class ControlZoomComponent implements OnInit, OnDestroy { - instance: control.Zoom; + instance: Zoom; @Input() duration: number; @@ -27,7 +27,7 @@ export class ControlZoomComponent implements OnInit, OnDestroy { } ngOnInit() { - this.instance = new control.Zoom(this); + this.instance = new Zoom(this); this.map.instance.addControl(this.instance); } diff --git a/projects/ngx-openlayers/src/lib/controls/zoomslider.component.ts b/projects/ngx-openlayers/src/lib/controls/zoomslider.component.ts index acd0f1f1..2ec79ffc 100644 --- a/projects/ngx-openlayers/src/lib/controls/zoomslider.component.ts +++ b/projects/ngx-openlayers/src/lib/controls/zoomslider.component.ts @@ -1,5 +1,5 @@ import { Component, Input, OnDestroy, OnInit } from '@angular/core'; -import { control } from 'openlayers'; +import { ZoomSlider } from 'ol/control'; import { MapComponent } from '../map.component'; @Component({ @@ -7,7 +7,7 @@ import { MapComponent } from '../map.component'; template: ``, }) export class ControlZoomSliderComponent implements OnInit, OnDestroy { - instance: control.ZoomSlider; + instance: ZoomSlider; @Input() className: string; @@ -23,7 +23,7 @@ export class ControlZoomSliderComponent implements OnInit, OnDestroy { } ngOnInit() { - this.instance = new control.ZoomSlider(this); + this.instance = new ZoomSlider(this); this.map.instance.addControl(this.instance); } diff --git a/projects/ngx-openlayers/src/lib/controls/zoomtoextent.component.ts b/projects/ngx-openlayers/src/lib/controls/zoomtoextent.component.ts index b134b558..45d20df7 100644 --- a/projects/ngx-openlayers/src/lib/controls/zoomtoextent.component.ts +++ b/projects/ngx-openlayers/src/lib/controls/zoomtoextent.component.ts @@ -1,13 +1,14 @@ import { Component, Input, OnDestroy, OnInit } from '@angular/core'; -import { control, Extent } from 'openlayers'; +import { ZoomToExtent } from 'ol/control'; import { MapComponent } from '../map.component'; +import { Extent } from '../../ol-models'; @Component({ selector: 'aol-control-zoomtoextent', template: ``, }) export class ControlZoomToExtentComponent implements OnInit, OnDestroy { - instance: control.ZoomToExtent; + instance: ZoomToExtent; @Input() className: string; @@ -23,7 +24,7 @@ export class ControlZoomToExtentComponent implements OnInit, OnDestroy { } ngOnInit() { - this.instance = new control.ZoomToExtent(this); + this.instance = new ZoomToExtent(this); this.map.instance.addControl(this.instance); } diff --git a/projects/ngx-openlayers/src/lib/coordinate.component.ts b/projects/ngx-openlayers/src/lib/coordinate.component.ts index 187a05ba..4b7fc97c 100644 --- a/projects/ngx-openlayers/src/lib/coordinate.component.ts +++ b/projects/ngx-openlayers/src/lib/coordinate.component.ts @@ -1,9 +1,10 @@ import { Component, Optional, OnChanges, Input, SimpleChanges } from '@angular/core'; -import { proj, Coordinate } from 'openlayers'; +import { Projection, transform } from 'ol/proj'; import { MapComponent } from './map.component'; -import { GeometryPointComponent, GeometryLinestringComponent, GeometryPolygonComponent } from './geometry.components'; import { ViewComponent } from './view.component'; +import { GeometryLinestringComponent, GeometryPointComponent, GeometryPolygonComponent } from './geometry.components'; import { OverlayComponent } from './overlay.component'; +import { Coordinate } from '../ol-models'; @Component({ selector: 'aol-coordinate', @@ -36,7 +37,7 @@ export class CoordinateComponent implements OnChanges { } ngOnChanges(changes: SimpleChanges) { - let referenceProjection: proj.Projection; + let referenceProjection: Projection; let referenceProjectionCode: string; let transformedCoordinates: number[]; @@ -46,7 +47,7 @@ export class CoordinateComponent implements OnChanges { if (this.srid === referenceProjectionCode) { transformedCoordinates = [this.x, this.y]; } else { - transformedCoordinates = proj.transform([this.x, this.y], this.srid, referenceProjectionCode); + transformedCoordinates = transform([this.x, this.y], this.srid, referenceProjectionCode); } switch (this.host.componentType) { @@ -91,7 +92,7 @@ export class CollectionCoordinatesComponent implements OnChanges { } ngOnChanges(changes: SimpleChanges) { - let referenceProjection: proj.Projection; + let referenceProjection: Projection; let referenceProjectionCode: string; let transformedCoordinates: Array; @@ -106,7 +107,7 @@ export class CollectionCoordinatesComponent implements OnChanges { transformedCoordinates = []; this.coordinates.forEach( function(coordinate: Coordinate) { - transformedCoordinates.push(proj.transform(coordinate, this.srid, referenceProjectionCode)); + transformedCoordinates.push(transform(coordinate, this.srid, referenceProjectionCode)); }.bind(this) ); } diff --git a/projects/ngx-openlayers/src/lib/feature.component.ts b/projects/ngx-openlayers/src/lib/feature.component.ts index 3d2389cb..60f744db 100644 --- a/projects/ngx-openlayers/src/lib/feature.component.ts +++ b/projects/ngx-openlayers/src/lib/feature.component.ts @@ -1,5 +1,5 @@ import { Component, OnInit, OnDestroy, OnChanges, Input, SimpleChanges } from '@angular/core'; -import { Feature } from 'openlayers'; +import { Feature } from 'ol'; import { SourceVectorComponent } from './sources/vector.component'; @Component({ diff --git a/projects/ngx-openlayers/src/lib/formats/format.component.ts b/projects/ngx-openlayers/src/lib/formats/format.component.ts index 8df2241b..74c60efd 100644 --- a/projects/ngx-openlayers/src/lib/formats/format.component.ts +++ b/projects/ngx-openlayers/src/lib/formats/format.component.ts @@ -1,6 +1,6 @@ -import { format } from 'openlayers'; +import Feature from 'ol/format/Feature'; export class FormatComponent { - public instance: format.Feature; + public instance: Feature; public componentType = 'format'; } diff --git a/projects/ngx-openlayers/src/lib/formats/mvt.component.ts b/projects/ngx-openlayers/src/lib/formats/mvt.component.ts index 824b1182..89df4058 100644 --- a/projects/ngx-openlayers/src/lib/formats/mvt.component.ts +++ b/projects/ngx-openlayers/src/lib/formats/mvt.component.ts @@ -1,6 +1,8 @@ import { Component, forwardRef, Input } from '@angular/core'; -import { format, geom } from 'openlayers'; import { FormatComponent } from './format.component'; +import { MVT } from 'ol/format'; +import { Geometry } from 'ol/geom'; +import GeometryType from 'ol/geom/GeometryType'; @Component({ selector: 'aol-format-mvt', @@ -8,12 +10,12 @@ import { FormatComponent } from './format.component'; providers: [{ provide: FormatComponent, useExisting: forwardRef(() => FormatMVTComponent) }], }) export class FormatMVTComponent extends FormatComponent { - instance: format.MVT; + instance: MVT; @Input() featureClass: - | ((geom: geom.Geometry | { [k: string]: any }) => any) - | ((geom: geom.GeometryType, arg2: number[], arg3: number[] | number[][], arg4: { [k: string]: any }) => any); + | ((geom: Geometry | { [k: string]: any }) => any) + | ((geom: GeometryType, arg2: number[], arg3: number[] | number[][], arg4: { [k: string]: any }) => any); @Input() geometryName: string; @Input() @@ -23,6 +25,6 @@ export class FormatMVTComponent extends FormatComponent { constructor() { super(); - this.instance = new format.MVT(this); + this.instance = new MVT(this); } } diff --git a/projects/ngx-openlayers/src/lib/geometry.components.ts b/projects/ngx-openlayers/src/lib/geometry.components.ts index 770d408c..1cd2d36d 100644 --- a/projects/ngx-openlayers/src/lib/geometry.components.ts +++ b/projects/ngx-openlayers/src/lib/geometry.components.ts @@ -1,5 +1,5 @@ import { Component, OnInit, OnDestroy } from '@angular/core'; -import { geom } from 'openlayers'; +import { Geometry, LineString, Point, Polygon } from 'ol/geom'; import { FeatureComponent } from './feature.component'; @Component({ @@ -8,14 +8,14 @@ import { FeatureComponent } from './feature.component'; }) export class GeometryLinestringComponent implements OnInit, OnDestroy { public componentType = 'geometry-linestring'; - public instance: geom.LineString; + public instance: LineString; constructor(private host: FeatureComponent) { // console.log('instancing aol-geometry-linestring'); } ngOnInit() { - this.instance = new geom.LineString([]); + this.instance = new LineString([]); this.host.instance.setGeometry(this.instance); } ngOnDestroy() { @@ -29,14 +29,14 @@ export class GeometryLinestringComponent implements OnInit, OnDestroy { }) export class GeometryPointComponent implements OnInit, OnDestroy { public componentType = 'geometry-point'; - public instance: geom.Point; + public instance: Point; constructor(private host: FeatureComponent) { // console.log('creating aol-geometry-point'); } ngOnInit() { - this.instance = new geom.Point([0, 0]); // defaulting coordinates to [0,0]. To be overridden in child component. + this.instance = new Point([0, 0]); // defaulting coordinates to [0,0]. To be overridden in child component. this.host.instance.setGeometry(this.instance); } @@ -51,7 +51,7 @@ export class GeometryPointComponent implements OnInit, OnDestroy { }) export class GeometryPolygonComponent implements OnInit, OnDestroy { public componentType = 'geometry-polygon'; - public instance: geom.Polygon; + public instance: Polygon; constructor(private host: FeatureComponent) { // console.log('creating aol-geometry-polygon'); @@ -59,7 +59,7 @@ export class GeometryPolygonComponent implements OnInit, OnDestroy { ngOnInit() { // defaulting coordinates to [0,0]. To be overridden in child component. - this.instance = new geom.Polygon([[[0, 0], [1, 0], [1, 1]]]); + this.instance = new Polygon([[[0, 0], [1, 0], [1, 1]]]); this.host.instance.setGeometry(this.instance); } diff --git a/projects/ngx-openlayers/src/lib/graticule.component.ts b/projects/ngx-openlayers/src/lib/graticule.component.ts index ad90c70f..e21dd60c 100644 --- a/projects/ngx-openlayers/src/lib/graticule.component.ts +++ b/projects/ngx-openlayers/src/lib/graticule.component.ts @@ -1,5 +1,6 @@ import { Component, Input, AfterContentInit, OnChanges, SimpleChanges } from '@angular/core'; -import { Graticule, style } from 'openlayers'; +import { Graticule } from 'ol'; +import { Stroke } from 'ol/style'; import { MapComponent } from './map.component'; @Component({ @@ -11,7 +12,7 @@ export class GraticuleComponent implements AfterContentInit, OnChanges { public componentType = 'graticule'; @Input() - strokeStyle: style.Stroke; + strokeStyle: Stroke; @Input() showLabels: boolean; @Input() diff --git a/projects/ngx-openlayers/src/lib/interactions/default.component.ts b/projects/ngx-openlayers/src/lib/interactions/default.component.ts index 6e17dbae..73443000 100644 --- a/projects/ngx-openlayers/src/lib/interactions/default.component.ts +++ b/projects/ngx-openlayers/src/lib/interactions/default.component.ts @@ -1,5 +1,6 @@ import { Component, OnDestroy, OnInit } from '@angular/core'; -import { interaction, Collection } from 'openlayers'; +import { defaults, Interaction } from 'ol/interaction'; +import { Collection } from 'ol'; import { MapComponent } from '../map.component'; @Component({ @@ -7,12 +8,12 @@ import { MapComponent } from '../map.component'; template: '', }) export class DefaultInteractionComponent implements OnInit, OnDestroy { - instance: Collection; + instance: Collection; constructor(private map: MapComponent) {} ngOnInit() { - this.instance = interaction.defaults(); + this.instance = defaults(); this.instance.forEach(i => this.map.instance.addInteraction(i)); } diff --git a/projects/ngx-openlayers/src/lib/interactions/doubleclickzoom.component.ts b/projects/ngx-openlayers/src/lib/interactions/doubleclickzoom.component.ts index 2eaf570a..982343cf 100644 --- a/projects/ngx-openlayers/src/lib/interactions/doubleclickzoom.component.ts +++ b/projects/ngx-openlayers/src/lib/interactions/doubleclickzoom.component.ts @@ -1,5 +1,5 @@ import { Component, Input, OnDestroy, OnInit } from '@angular/core'; -import { interaction } from 'openlayers'; +import { DoubleClickZoom } from 'ol/interaction'; import { MapComponent } from '../map.component'; @Component({ @@ -7,7 +7,7 @@ import { MapComponent } from '../map.component'; template: '', }) export class DoubleClickZoomInteractionComponent implements OnInit, OnDestroy { - instance: interaction.DoubleClickZoom; + instance: DoubleClickZoom; @Input() duration: number; @@ -17,7 +17,7 @@ export class DoubleClickZoomInteractionComponent implements OnInit, OnDestroy { constructor(private map: MapComponent) {} ngOnInit() { - this.instance = new interaction.DoubleClickZoom(this); + this.instance = new DoubleClickZoom(this); this.map.instance.addInteraction(this.instance); } diff --git a/projects/ngx-openlayers/src/lib/interactions/draganddrop.component.ts b/projects/ngx-openlayers/src/lib/interactions/draganddrop.component.ts index 60b7f3a1..be62d382 100644 --- a/projects/ngx-openlayers/src/lib/interactions/draganddrop.component.ts +++ b/projects/ngx-openlayers/src/lib/interactions/draganddrop.component.ts @@ -1,16 +1,18 @@ import { Component, Input, OnDestroy, OnInit } from '@angular/core'; -import { interaction, format, ProjectionLike } from 'openlayers'; +import { DragAndDrop } from 'ol/interaction'; +import Feature from 'ol/format/Feature'; import { MapComponent } from '../map.component'; +import { ProjectionLike } from '../../ol-models'; @Component({ selector: 'aol-interaction-draganddrop', template: '', }) export class DragAndDropInteractionComponent implements OnInit, OnDestroy { - instance: interaction.DragAndDrop; + instance: DragAndDrop; @Input() - formatConstructors: ((n: format.Feature) => any)[]; + formatConstructors: ((n: Feature) => any)[]; @Input() projection: ProjectionLike; @Input() @@ -19,7 +21,7 @@ export class DragAndDropInteractionComponent implements OnInit, OnDestroy { constructor(private map: MapComponent) {} ngOnInit() { - this.instance = new interaction.DragAndDrop(this); + this.instance = new DragAndDrop(this); this.map.instance.addInteraction(this.instance); } diff --git a/projects/ngx-openlayers/src/lib/interactions/dragbox.component.ts b/projects/ngx-openlayers/src/lib/interactions/dragbox.component.ts index 07521478..85a51e6d 100644 --- a/projects/ngx-openlayers/src/lib/interactions/dragbox.component.ts +++ b/projects/ngx-openlayers/src/lib/interactions/dragbox.component.ts @@ -1,25 +1,26 @@ import { Component, OnDestroy, OnInit, Input } from '@angular/core'; -import { interaction, EventsConditionType, DragBoxEndConditionType } from 'openlayers'; +import { DragBox } from 'ol/interaction'; import { MapComponent } from '../map.component'; +import { DragBoxEndCondition, EventsCondition } from '../../ol-models'; @Component({ selector: 'aol-interaction-dragbox', template: '', }) export class DragBoxInteractionComponent implements OnInit, OnDestroy { - instance: interaction.DragBox; + instance: DragBox; @Input() className: string; @Input() - condition: EventsConditionType; + condition: EventsCondition; @Input() - boxEndCondition: DragBoxEndConditionType; + boxEndCondition: DragBoxEndCondition; constructor(private map: MapComponent) {} ngOnInit() { - this.instance = new interaction.DragBox(this); + this.instance = new DragBox(this); this.map.instance.addInteraction(this.instance); } diff --git a/projects/ngx-openlayers/src/lib/interactions/dragpan.component.ts b/projects/ngx-openlayers/src/lib/interactions/dragpan.component.ts index fdebad88..8b71bad0 100644 --- a/projects/ngx-openlayers/src/lib/interactions/dragpan.component.ts +++ b/projects/ngx-openlayers/src/lib/interactions/dragpan.component.ts @@ -1,23 +1,25 @@ import { Component, OnDestroy, OnInit, Input } from '@angular/core'; -import { interaction, EventsConditionType, Kinetic } from 'openlayers'; +import { DragPan } from 'ol/interaction'; +import Kinetic from 'ol/Kinetic'; import { MapComponent } from '../map.component'; +import { EventsCondition } from '../../ol-models'; @Component({ selector: 'aol-interaction-dragpan', template: '', }) export class DragPanInteractionComponent implements OnInit, OnDestroy { - instance: interaction.DragPan; + instance: DragPan; @Input() - condition: EventsConditionType; + condition: EventsCondition; @Input() kinetic: Kinetic; constructor(private map: MapComponent) {} ngOnInit() { - this.instance = new interaction.DragPan(this); + this.instance = new DragPan(this); this.map.instance.addInteraction(this.instance); } diff --git a/projects/ngx-openlayers/src/lib/interactions/dragrotate.component.ts b/projects/ngx-openlayers/src/lib/interactions/dragrotate.component.ts index 16462643..13bc7ff9 100644 --- a/projects/ngx-openlayers/src/lib/interactions/dragrotate.component.ts +++ b/projects/ngx-openlayers/src/lib/interactions/dragrotate.component.ts @@ -1,23 +1,24 @@ import { Component, OnDestroy, OnInit, Input } from '@angular/core'; -import { interaction, EventsConditionType } from 'openlayers'; +import { DragRotate } from 'ol/interaction'; import { MapComponent } from '../map.component'; +import { EventsCondition } from '../../ol-models'; @Component({ selector: 'aol-interaction-dragrotate', template: '', }) export class DragRotateInteractionComponent implements OnInit, OnDestroy { - instance: interaction.DragRotate; + instance: DragRotate; @Input() - condition: EventsConditionType; + condition: EventsCondition; @Input() duration: number; constructor(private map: MapComponent) {} ngOnInit() { - this.instance = new interaction.DragRotate(this); + this.instance = new DragRotate(this); this.map.instance.addInteraction(this.instance); } diff --git a/projects/ngx-openlayers/src/lib/interactions/dragrotateandzoom.component.ts b/projects/ngx-openlayers/src/lib/interactions/dragrotateandzoom.component.ts index ff401860..4f579690 100644 --- a/projects/ngx-openlayers/src/lib/interactions/dragrotateandzoom.component.ts +++ b/projects/ngx-openlayers/src/lib/interactions/dragrotateandzoom.component.ts @@ -1,23 +1,24 @@ import { Component, OnDestroy, OnInit, Input } from '@angular/core'; -import { interaction, EventsConditionType } from 'openlayers'; +import { DragRotateAndZoom } from 'ol/interaction'; import { MapComponent } from '../map.component'; +import { EventsCondition } from '../../ol-models'; @Component({ selector: 'aol-interaction-dragrotateandzoom', template: '', }) export class DragRotateAndZoomInteractionComponent implements OnInit, OnDestroy { - instance: interaction.DragRotate; + instance: DragRotateAndZoom; @Input() - condition: EventsConditionType; + condition: EventsCondition; @Input() duration: number; constructor(private map: MapComponent) {} ngOnInit() { - this.instance = new interaction.DragRotateAndZoom(this); + this.instance = new DragRotateAndZoom(this); this.map.instance.addInteraction(this.instance); } diff --git a/projects/ngx-openlayers/src/lib/interactions/dragzoom.component.ts b/projects/ngx-openlayers/src/lib/interactions/dragzoom.component.ts index dc6fd16c..a8ba9d84 100644 --- a/projects/ngx-openlayers/src/lib/interactions/dragzoom.component.ts +++ b/projects/ngx-openlayers/src/lib/interactions/dragzoom.component.ts @@ -1,18 +1,19 @@ import { Component, OnDestroy, OnInit, Input } from '@angular/core'; -import { interaction, EventsConditionType } from 'openlayers'; +import { DragZoom } from 'ol/interaction'; import { MapComponent } from '../map.component'; +import { EventsCondition } from '../../ol-models'; @Component({ selector: 'aol-interaction-dragzoom', template: '', }) export class DragZoomInteractionComponent implements OnInit, OnDestroy { - instance: interaction.DragZoom; + instance: DragZoom; @Input() className: string; @Input() - condition: EventsConditionType; + condition: EventsCondition; @Input() duration: number; @Input() @@ -21,7 +22,7 @@ export class DragZoomInteractionComponent implements OnInit, OnDestroy { constructor(private map: MapComponent) {} ngOnInit() { - this.instance = new interaction.DragZoom(this); + this.instance = new DragZoom(this); this.map.instance.addInteraction(this.instance); } diff --git a/projects/ngx-openlayers/src/lib/interactions/draw.component.ts b/projects/ngx-openlayers/src/lib/interactions/draw.component.ts index edbaa38d..1fb7f078 100644 --- a/projects/ngx-openlayers/src/lib/interactions/draw.component.ts +++ b/projects/ngx-openlayers/src/lib/interactions/draw.component.ts @@ -1,65 +1,71 @@ import { Component, Input, OnDestroy, OnInit, EventEmitter, Output } from '@angular/core'; -import { interaction } from 'openlayers'; import { MapComponent } from '../map.component'; +import { Draw } from 'ol/interaction'; +import { Collection, Feature } from 'ol'; +import { Vector } from 'ol/source'; +import GeometryType from 'ol/geom/GeometryType'; +import { Style } from 'ol/style'; +import { StyleFunction } from '../../ol-models'; +import { DrawEvent } from 'ol/interaction/Draw'; @Component({ selector: 'aol-interaction-draw', template: '', }) export class DrawInteractionComponent implements OnInit, OnDestroy { - instance: interaction.Draw; + instance: Draw; @Input() clickTolerance?: number; @Input() - features?: ol.Collection; + features?: Collection; @Input() - source?: ol.source.Vector; + source?: Vector; @Input() snapTolerance?: number; @Input() - type: ol.geom.GeometryType; + type: GeometryType; @Input() maxPoints?: number; @Input() minPoints?: number; @Input() - finishCondition?: ol.EventsConditionType; + finishCondition?: any; // TODO: ol.EventsConditionType; @Input() - style?: ol.style.Style | ol.style.Style[] | ol.StyleFunction; + style?: Style | Style[] | StyleFunction; @Input() - geometryFunction?: ol.DrawGeometryFunctionType; + geometryFunction?: any; // TODO: ol.DrawGeometryFunctionType; @Input() geometryName?: string; @Input() - condition?: ol.EventsConditionType; + condition?: any; // TODO: ol.EventsConditionType; @Input() - freehandCondition?: ol.EventsConditionType; + freehandCondition?: any; // TODO: ol.EventsConditionType; @Input() freehand?: boolean; @Input() wrapX?: boolean; @Output() - onChange = new EventEmitter(); + onChange = new EventEmitter(); @Output() - onChangeActive = new EventEmitter(); + onChangeActive = new EventEmitter(); @Output() - onDrawEnd = new EventEmitter(); + onDrawEnd = new EventEmitter(); @Output() - onDrawStart = new EventEmitter(); + onDrawStart = new EventEmitter(); @Output() - onPropertyChange = new EventEmitter(); + onPropertyChange = new EventEmitter(); constructor(private map: MapComponent) {} ngOnInit() { - this.instance = new interaction.Draw(this); - this.instance.on('change', (event: ol.interaction.Draw.Event) => this.onChange.emit(event)); - this.instance.on('change:active', (event: ol.interaction.Draw.Event) => this.onChangeActive.emit(event)); - this.instance.on('drawend', (event: ol.interaction.Draw.Event) => this.onDrawEnd.emit(event)); - this.instance.on('drawstart', (event: ol.interaction.Draw.Event) => this.onDrawStart.emit(event)); - this.instance.on('propertychange', (event: ol.interaction.Draw.Event) => this.onPropertyChange.emit(event)); + this.instance = new Draw(this); + this.instance.on('change', (event: DrawEvent) => this.onChange.emit(event)); + this.instance.on('change:active', (event: DrawEvent) => this.onChangeActive.emit(event)); + this.instance.on('drawend', (event: DrawEvent) => this.onDrawEnd.emit(event)); + this.instance.on('drawstart', (event: DrawEvent) => this.onDrawStart.emit(event)); + this.instance.on('propertychange', (event: DrawEvent) => this.onPropertyChange.emit(event)); this.map.instance.addInteraction(this.instance); } diff --git a/projects/ngx-openlayers/src/lib/interactions/modify.component.ts b/projects/ngx-openlayers/src/lib/interactions/modify.component.ts index 2f34d14c..0d1163b8 100644 --- a/projects/ngx-openlayers/src/lib/interactions/modify.component.ts +++ b/projects/ngx-openlayers/src/lib/interactions/modify.component.ts @@ -1,49 +1,54 @@ import { Component, OnDestroy, OnInit, Input, Output, EventEmitter } from '@angular/core'; -import { interaction, EventsConditionType, style, StyleFunction, Collection, Feature, source } from 'openlayers'; import { MapComponent } from '../map.component'; +import { Modify } from 'ol/interaction'; +import { Collection, Feature } from 'ol'; +import { Style } from 'ol/style'; +import { StyleFunction } from '../../ol-models'; +import { Vector } from 'ol/source'; +import { ModifyEvent } from 'ol/interaction/Modify'; @Component({ selector: 'aol-interaction-modify', template: '', }) export class ModifyInteractionComponent implements OnInit, OnDestroy { - instance: interaction.Modify; + instance: Modify; @Input() - condition?: EventsConditionType; + condition?: any; // TODO: EventsConditionType; @Input() - deleteCondition?: EventsConditionType; + deleteCondition?: any; // TODO: EventsConditionType; @Input() pixelTolerance?: number; @Input() - style?: style.Style | style.Style[] | StyleFunction; + style?: Style | Style[] | StyleFunction; @Input() features: Collection; @Input() wrapX?: boolean; @Input() - source?: source.Vector; + source?: Vector; @Output() - onModifyEnd = new EventEmitter(); + onModifyEnd = new EventEmitter(); @Output() - onModifyStart = new EventEmitter(); + onModifyStart = new EventEmitter(); @Output() - onChange = new EventEmitter(); + onChange = new EventEmitter(); @Output() - onChangeActive = new EventEmitter(); + onChangeActive = new EventEmitter(); @Output() - onPropertyChange = new EventEmitter(); + onPropertyChange = new EventEmitter(); constructor(private map: MapComponent) {} ngOnInit() { - this.instance = new interaction.Modify(this); - this.instance.on('change', (event: interaction.Modify.Event) => this.onChange.emit(event)); - this.instance.on('change:active', (event: interaction.Modify.Event) => this.onChangeActive.emit(event)); - this.instance.on('propertychange', (event: interaction.Modify.Event) => this.onPropertyChange.emit(event)); - this.instance.on('modifyend', (event: interaction.Modify.Event) => this.onModifyEnd.emit(event)); - this.instance.on('modifystart', (event: interaction.Modify.Event) => this.onModifyStart.emit(event)); + this.instance = new Modify(this); + this.instance.on('change', (event: ModifyEvent) => this.onChange.emit(event)); + this.instance.on('change:active', (event: ModifyEvent) => this.onChangeActive.emit(event)); + this.instance.on('propertychange', (event: ModifyEvent) => this.onPropertyChange.emit(event)); + this.instance.on('modifyend', (event: ModifyEvent) => this.onModifyEnd.emit(event)); + this.instance.on('modifystart', (event: ModifyEvent) => this.onModifyStart.emit(event)); this.map.instance.addInteraction(this.instance); } diff --git a/projects/ngx-openlayers/src/lib/interactions/mousewheelzoom.component.ts b/projects/ngx-openlayers/src/lib/interactions/mousewheelzoom.component.ts index a6738c24..c64deacd 100644 --- a/projects/ngx-openlayers/src/lib/interactions/mousewheelzoom.component.ts +++ b/projects/ngx-openlayers/src/lib/interactions/mousewheelzoom.component.ts @@ -1,5 +1,5 @@ import { Component, Input, OnDestroy, OnInit } from '@angular/core'; -import { interaction } from 'openlayers'; +import { MouseWheelZoom } from 'ol/interaction'; import { MapComponent } from '../map.component'; @Component({ @@ -7,7 +7,7 @@ import { MapComponent } from '../map.component'; template: '', }) export class MouseWheelZoomInteractionComponent implements OnInit, OnDestroy { - instance: interaction.MouseWheelZoom; + instance: MouseWheelZoom; @Input() duration: number; @Input() @@ -18,7 +18,7 @@ export class MouseWheelZoomInteractionComponent implements OnInit, OnDestroy { constructor(private map: MapComponent) {} ngOnInit() { - this.instance = new interaction.MouseWheelZoom(this); + this.instance = new MouseWheelZoom(this); this.map.instance.addInteraction(this.instance); } diff --git a/projects/ngx-openlayers/src/lib/interactions/pinchzoom.component.ts b/projects/ngx-openlayers/src/lib/interactions/pinchzoom.component.ts index ffb6b886..5d63441f 100644 --- a/projects/ngx-openlayers/src/lib/interactions/pinchzoom.component.ts +++ b/projects/ngx-openlayers/src/lib/interactions/pinchzoom.component.ts @@ -1,5 +1,5 @@ import { Component, OnDestroy, OnInit, Input } from '@angular/core'; -import { interaction } from 'openlayers'; +import { PinchZoom } from 'ol/interaction'; import { MapComponent } from '../map.component'; @Component({ @@ -7,7 +7,7 @@ import { MapComponent } from '../map.component'; template: '', }) export class PinchZoomInteractionComponent implements OnInit, OnDestroy { - instance: interaction.PinchZoom; + instance: PinchZoom; @Input() duration: number; @@ -17,7 +17,7 @@ export class PinchZoomInteractionComponent implements OnInit, OnDestroy { constructor(private map: MapComponent) {} ngOnInit() { - this.instance = new interaction.PinchZoom(this); + this.instance = new PinchZoom(this); this.map.instance.addInteraction(this.instance); } diff --git a/projects/ngx-openlayers/src/lib/interactions/select.component.ts b/projects/ngx-openlayers/src/lib/interactions/select.component.ts index 258233e9..13ec5eca 100644 --- a/projects/ngx-openlayers/src/lib/interactions/select.component.ts +++ b/projects/ngx-openlayers/src/lib/interactions/select.component.ts @@ -1,35 +1,31 @@ import { Component, OnDestroy, OnInit, Input, Output, EventEmitter } from '@angular/core'; -import { - interaction, - EventsConditionType, - layer, - style, - Collection, - SelectFilterFunction, - StyleFunction, - Feature, -} from 'openlayers'; import { MapComponent } from '../map.component'; +import { Select } from 'ol/interaction'; +import { Layer } from 'ol/layer'; +import { Style } from 'ol/style'; +import { SelectFilterFunction, StyleFunction } from '../../ol-models'; +import { Collection, Feature } from 'ol'; +import { SelectEvent } from 'ol/interaction/Select'; @Component({ selector: 'aol-interaction-select', template: '', }) export class SelectInteractionComponent implements OnInit, OnDestroy { - instance: interaction.Select; + instance: Select; @Input() - addCondition?: EventsConditionType; + addCondition?: any; // TODO: EventsConditionType; @Input() - condition?: EventsConditionType; + condition?: any; // TODO: EventsConditionType; @Input() - layers?: layer.Layer[] | ((layer: layer.Layer) => boolean); + layers?: Layer[] | ((layer: Layer) => boolean); @Input() - style?: style.Style | style.Style[] | StyleFunction; + style?: Style | Style[] | StyleFunction; @Input() - removeCondition?: EventsConditionType; + removeCondition?: any; // TODO: EventsConditionType; @Input() - toggleCondition?: EventsConditionType; + toggleCondition?: any; // TODO: EventsConditionType; @Input() multi?: boolean; @Input() @@ -40,20 +36,20 @@ export class SelectInteractionComponent implements OnInit, OnDestroy { wrapX?: boolean; @Output() - onChange = new EventEmitter(); + onChange = new EventEmitter(); @Output() - onSelect = new EventEmitter(); + onSelect = new EventEmitter(); @Output() - onPropertyChange = new EventEmitter(); + onPropertyChange = new EventEmitter(); constructor(private map: MapComponent) {} ngOnInit() { - this.instance = new interaction.Select(this); + this.instance = new Select(this); - this.instance.on('change', (event: interaction.Select.Event) => this.onChange.emit(event)); - this.instance.on('select', (event: interaction.Select.Event) => this.onSelect.emit(event)); - this.instance.on('propertychange', (event: interaction.Select.Event) => this.onPropertyChange.emit(event)); + this.instance.on('change', (event: SelectEvent) => this.onChange.emit(event)); + this.instance.on('select', (event: SelectEvent) => this.onSelect.emit(event)); + this.instance.on('propertychange', (event: SelectEvent) => this.onPropertyChange.emit(event)); this.map.instance.addInteraction(this.instance); } diff --git a/projects/ngx-openlayers/src/lib/interactions/translate.component.ts b/projects/ngx-openlayers/src/lib/interactions/translate.component.ts index 700aa4d0..4e1813ad 100644 --- a/projects/ngx-openlayers/src/lib/interactions/translate.component.ts +++ b/projects/ngx-openlayers/src/lib/interactions/translate.component.ts @@ -1,5 +1,8 @@ import { Component, OnDestroy, OnInit, Input, Output, EventEmitter } from '@angular/core'; -import { interaction, layer, Collection, Feature } from 'openlayers'; +import { Translate } from 'ol/interaction'; +import { Collection, Feature } from 'ol'; +import { Layer } from 'ol/layer'; +import { TranslateEvent } from 'ol/interaction/Translate'; import { MapComponent } from '../map.component'; @Component({ @@ -7,42 +10,42 @@ import { MapComponent } from '../map.component'; template: '', }) export class TranslateInteractionComponent implements OnInit, OnDestroy { - instance: interaction.Translate; + instance: Translate; @Input() features?: Collection; @Input() - layers?: layer.Layer[] | ((layer: layer.Layer) => boolean); + layers?: Layer[] | ((layer: Layer) => boolean); @Input() hitTolerance?: number; @Output() - onChange: EventEmitter; + onChange: EventEmitter; @Output() - onPropertyChange: EventEmitter; + onPropertyChange: EventEmitter; @Output() - onTranslateEnd: EventEmitter; + onTranslateEnd: EventEmitter; @Output() - onTranslateStart: EventEmitter; + onTranslateStart: EventEmitter; @Output() - onTranslating: EventEmitter; + onTranslating: EventEmitter; constructor(private map: MapComponent) { - this.onChange = new EventEmitter(); - this.onPropertyChange = new EventEmitter(); - this.onTranslateEnd = new EventEmitter(); - this.onTranslateStart = new EventEmitter(); - this.onTranslating = new EventEmitter(); + this.onChange = new EventEmitter(); + this.onPropertyChange = new EventEmitter(); + this.onTranslateEnd = new EventEmitter(); + this.onTranslateStart = new EventEmitter(); + this.onTranslating = new EventEmitter(); } ngOnInit() { - this.instance = new interaction.Translate(this); + this.instance = new Translate(this); - this.instance.on('change', (event: interaction.Translate.Event) => this.onChange.emit(event)); - this.instance.on('propertychange', (event: interaction.Translate.Event) => this.onPropertyChange.emit(event)); - this.instance.on('translateend', (event: interaction.Translate.Event) => this.onTranslateEnd.emit(event)); - this.instance.on('translatestart', (event: interaction.Translate.Event) => this.onTranslateStart.emit(event)); - this.instance.on('translating', (event: interaction.Translate.Event) => this.onTranslating.emit(event)); + this.instance.on('change', (event: TranslateEvent) => this.onChange.emit(event)); + this.instance.on('propertychange', (event: TranslateEvent) => this.onPropertyChange.emit(event)); + this.instance.on('translateend', (event: TranslateEvent) => this.onTranslateEnd.emit(event)); + this.instance.on('translatestart', (event: TranslateEvent) => this.onTranslateStart.emit(event)); + this.instance.on('translating', (event: TranslateEvent) => this.onTranslating.emit(event)); this.map.instance.addInteraction(this.instance); } diff --git a/projects/ngx-openlayers/src/lib/layers/layer.component.ts b/projects/ngx-openlayers/src/lib/layers/layer.component.ts index 2a04696f..7e9ca97d 100644 --- a/projects/ngx-openlayers/src/lib/layers/layer.component.ts +++ b/projects/ngx-openlayers/src/lib/layers/layer.component.ts @@ -1,6 +1,7 @@ import { OnDestroy, OnInit, OnChanges, Input, SimpleChanges } from '@angular/core'; +import { Event } from 'ol/events'; import { MapComponent } from '../map.component'; -import { Extent } from 'openlayers'; +import { Extent } from '../../ol-models'; import { LayerGroupComponent } from './layergroup.component'; export abstract class LayerComponent implements OnInit, OnChanges, OnDestroy { @@ -21,11 +22,11 @@ export abstract class LayerComponent implements OnInit, OnChanges, OnDestroy { maxResolution: number; @Input() - precompose: (evt: ol.events.Event) => void; + precompose: (evt: Event) => void; @Input() - postcompose: (evt: ol.events.Event) => void; + postcompose: (evt: Event) => void; - constructor(protected host: LayerGroupComponent | MapComponent) {} + constructor(protected host: MapComponent | LayerGroupComponent) {} ngOnInit() { if (this.precompose !== null && this.precompose !== undefined) { diff --git a/projects/ngx-openlayers/src/lib/layers/layergroup.component.ts b/projects/ngx-openlayers/src/lib/layers/layergroup.component.ts index 031f4cf4..a68378c5 100644 --- a/projects/ngx-openlayers/src/lib/layers/layergroup.component.ts +++ b/projects/ngx-openlayers/src/lib/layers/layergroup.component.ts @@ -1,5 +1,5 @@ import { Component, OnDestroy, OnInit, SkipSelf, Optional } from '@angular/core'; -import { layer } from 'openlayers'; +import { Group } from 'ol/layer'; import { LayerComponent } from './layer.component'; import { MapComponent } from '../map.component'; @@ -8,7 +8,7 @@ import { MapComponent } from '../map.component'; template: ``, }) export class LayerGroupComponent extends LayerComponent implements OnInit, OnDestroy { - public instance: ol.layer.Group; + public instance: Group; constructor( map: MapComponent, @@ -21,7 +21,7 @@ export class LayerGroupComponent extends LayerComponent implements OnInit, OnDes ngOnInit() { // console.log(`creating ol.layer.Group instance with:`, this); - this.instance = new layer.Group(this); + this.instance = new Group(this); super.ngOnInit(); } } diff --git a/projects/ngx-openlayers/src/lib/layers/layerimage.component.ts b/projects/ngx-openlayers/src/lib/layers/layerimage.component.ts index c31555d3..2e043921 100644 --- a/projects/ngx-openlayers/src/lib/layers/layerimage.component.ts +++ b/projects/ngx-openlayers/src/lib/layers/layerimage.component.ts @@ -1,15 +1,16 @@ import { Component, Input, OnChanges, OnInit, Optional, SimpleChanges } from '@angular/core'; -import { Extent, layer, source } from 'openlayers'; +import { Image } from 'ol/layer'; import { MapComponent } from '../map.component'; import { LayerComponent } from './layer.component'; import { LayerGroupComponent } from './layergroup.component'; +import { Extent } from '../../ol-models'; @Component({ selector: 'aol-layer-image', template: ``, }) export class LayerImageComponent extends LayerComponent implements OnInit, OnChanges { - public source: source.Image; + public source: Image; @Input() opacity: number; @@ -29,7 +30,7 @@ export class LayerImageComponent extends LayerComponent implements OnInit, OnCha } ngOnInit() { - this.instance = new layer.Image(this); + this.instance = new Image(this); super.ngOnInit(); } diff --git a/projects/ngx-openlayers/src/lib/layers/layertile.component.ts b/projects/ngx-openlayers/src/lib/layers/layertile.component.ts index baf6dcde..4d5a557e 100644 --- a/projects/ngx-openlayers/src/lib/layers/layertile.component.ts +++ b/projects/ngx-openlayers/src/lib/layers/layertile.component.ts @@ -1,5 +1,5 @@ import { Component, OnDestroy, OnInit, Input, Optional, OnChanges, SimpleChanges } from '@angular/core'; -import { layer, source } from 'openlayers'; +import { Tile } from 'ol/layer'; import { MapComponent } from '../map.component'; import { LayerComponent } from './layer.component'; import { LayerGroupComponent } from './layergroup.component'; @@ -9,7 +9,7 @@ import { LayerGroupComponent } from './layergroup.component'; template: ``, }) export class LayerTileComponent extends LayerComponent implements OnInit, OnDestroy, OnChanges { - public source: source.Tile; + public source: Tile; @Input() preload: number; @@ -22,7 +22,7 @@ export class LayerTileComponent extends LayerComponent implements OnInit, OnDest ngOnInit() { // console.log('creating ol.layer.Tile instance with:', this); - this.instance = new layer.Tile(this); + this.instance = new Tile(this); super.ngOnInit(); } diff --git a/projects/ngx-openlayers/src/lib/layers/layervector.component.ts b/projects/ngx-openlayers/src/lib/layers/layervector.component.ts index 1d4928b3..54f7c8fa 100644 --- a/projects/ngx-openlayers/src/lib/layers/layervector.component.ts +++ b/projects/ngx-openlayers/src/lib/layers/layervector.component.ts @@ -1,5 +1,5 @@ import { Component, OnDestroy, OnInit, Input, Optional, OnChanges, SimpleChanges } from '@angular/core'; -import { layer, source } from 'openlayers'; +import { Vector } from 'ol/layer'; import { MapComponent } from '../map.component'; import { LayerComponent } from './layer.component'; import { LayerGroupComponent } from './layergroup.component'; @@ -9,7 +9,7 @@ import { LayerGroupComponent } from './layergroup.component'; template: ``, }) export class LayerVectorComponent extends LayerComponent implements OnInit, OnDestroy, OnChanges { - public source: source.Vector; + public source: Vector; @Input() renderBuffer: number; @@ -20,7 +20,7 @@ export class LayerVectorComponent extends LayerComponent implements OnInit, OnDe ngOnInit() { // console.log('creating ol.layer.Vector instance with:', this); - this.instance = new layer.Vector(this); + this.instance = new Vector(this); super.ngOnInit(); } diff --git a/projects/ngx-openlayers/src/lib/layers/layervectortile.component.ts b/projects/ngx-openlayers/src/lib/layers/layervectortile.component.ts index aca2583d..6af56e02 100644 --- a/projects/ngx-openlayers/src/lib/layers/layervectortile.component.ts +++ b/projects/ngx-openlayers/src/lib/layers/layervectortile.component.ts @@ -1,8 +1,12 @@ import { Component, OnInit, Input, Optional, SimpleChanges, OnChanges } from '@angular/core'; -import { layer, style, StyleFunction } from 'openlayers'; +import { VectorTile } from 'ol/layer'; +import { RenderType } from 'ol/layer/VectorTile'; +import { Feature } from 'ol'; +import { Style } from 'ol/style'; import { MapComponent } from '../map.component'; import { LayerComponent } from './layer.component'; import { LayerGroupComponent } from './layergroup.component'; +import { StyleFunction } from '../../ol-models'; @Component({ selector: 'aol-layer-vectortile', @@ -12,12 +16,12 @@ export class LayerVectorTileComponent extends LayerComponent implements OnInit, @Input() renderBuffer: number; @Input() - renderMode: layer.VectorTileRenderType | string; + renderMode: RenderType | string; /* not marked as optional in the typings */ @Input() - renderOrder: (feature1: ol.Feature, feature2: ol.Feature) => number; + renderOrder: (feature1: Feature, feature2: Feature) => number; @Input() - style: style.Style | style.Style[] | StyleFunction; + style: Style | Style[] | StyleFunction; @Input() updateWhileAnimating: boolean; @Input() @@ -31,7 +35,7 @@ export class LayerVectorTileComponent extends LayerComponent implements OnInit, ngOnInit() { // console.log('creating ol.layer.VectorTile instance with:', this); - this.instance = new layer.VectorTile(this); + this.instance = new VectorTile(this); super.ngOnInit(); } diff --git a/projects/ngx-openlayers/src/lib/map.component.ts b/projects/ngx-openlayers/src/lib/map.component.ts index 1b32b268..37f201ae 100644 --- a/projects/ngx-openlayers/src/lib/map.component.ts +++ b/projects/ngx-openlayers/src/lib/map.component.ts @@ -9,7 +9,13 @@ import { SimpleChanges, OnChanges, } from '@angular/core'; -import { Map, MapBrowserEvent, MapEvent, render, ObjectEvent, control, interaction } from 'openlayers'; +import Map from 'ol/Map'; +import MapBrowserEvent from 'ol/MapBrowserEvent'; +import MapEvent from 'ol/MapEvent'; +import ObjectEvent from 'ol/Object'; +import RenderEvent from 'ol/render/Event'; +import { Control } from 'ol/control'; +import { Interaction } from 'ol/interaction'; @Component({ selector: 'aol-map', @@ -47,19 +53,19 @@ export class MapComponent implements OnInit, AfterViewInit, OnChanges { @Output() onPointerMove: EventEmitter; @Output() - onPostCompose: EventEmitter; + onPostCompose: EventEmitter; @Output() onPostRender: EventEmitter; @Output() - onPreCompose: EventEmitter; + onPreCompose: EventEmitter; @Output() onPropertyChange: EventEmitter; @Output() onSingleClick: EventEmitter; // we pass empty arrays to not get default controls/interactions because we have our own directives - controls: control.Control[] = []; - interactions: interaction.Interaction[] = []; + controls: Control[] = []; + interactions: Interaction[] = []; constructor(private host: ElementRef) { this.onClick = new EventEmitter(); @@ -67,9 +73,9 @@ export class MapComponent implements OnInit, AfterViewInit, OnChanges { this.onMoveEnd = new EventEmitter(); this.onPointerDrag = new EventEmitter(); this.onPointerMove = new EventEmitter(); - this.onPostCompose = new EventEmitter(); + this.onPostCompose = new EventEmitter(); this.onPostRender = new EventEmitter(); - this.onPreCompose = new EventEmitter(); + this.onPreCompose = new EventEmitter(); this.onPropertyChange = new EventEmitter(); this.onSingleClick = new EventEmitter(); } @@ -83,9 +89,9 @@ export class MapComponent implements OnInit, AfterViewInit, OnChanges { this.instance.on('moveend', (event: MapEvent) => this.onMoveEnd.emit(event)); this.instance.on('pointerdrag', (event: MapBrowserEvent) => this.onPointerDrag.emit(event)); this.instance.on('pointermove', (event: MapBrowserEvent) => this.onPointerMove.emit(event)); - this.instance.on('postcompose', (event: render.Event) => this.onPostCompose.emit(event)); + this.instance.on('postcompose', (event: RenderEvent) => this.onPostCompose.emit(event)); this.instance.on('postrender', (event: MapEvent) => this.onPostRender.emit(event)); - this.instance.on('precompose', (event: render.Event) => this.onPreCompose.emit(event)); + this.instance.on('precompose', (event: RenderEvent) => this.onPreCompose.emit(event)); this.instance.on('propertychange', (event: ObjectEvent) => this.onPropertyChange.emit(event)); this.instance.on('singleclick', (event: MapBrowserEvent) => this.onSingleClick.emit(event)); } diff --git a/projects/ngx-openlayers/src/lib/overlay.component.ts b/projects/ngx-openlayers/src/lib/overlay.component.ts index 53cbe782..25e82f06 100644 --- a/projects/ngx-openlayers/src/lib/overlay.component.ts +++ b/projects/ngx-openlayers/src/lib/overlay.component.ts @@ -1,7 +1,8 @@ import { Component, ContentChild, Input, OnDestroy, OnInit } from '@angular/core'; import { MapComponent } from './map.component'; -import { Overlay, OverlayPositioning } from 'openlayers'; +import { Overlay } from 'ol'; import { ContentComponent } from './content.component'; +import { OverlayPositioning } from '../ol-models'; @Component({ selector: 'aol-overlay', @@ -27,7 +28,7 @@ export class OverlayComponent implements OnInit, OnDestroy { @Input() autoPan: boolean; @Input() - autoPanAnimation: olx.animation.PanOptions; + autoPanAnimation: any; // TODO: olx.animation.PanOptions; @Input() autoPanMargin: number; diff --git a/projects/ngx-openlayers/src/lib/sources/bingmaps.component.ts b/projects/ngx-openlayers/src/lib/sources/bingmaps.component.ts index 35f4b2cf..c5d23f8a 100644 --- a/projects/ngx-openlayers/src/lib/sources/bingmaps.component.ts +++ b/projects/ngx-openlayers/src/lib/sources/bingmaps.component.ts @@ -1,7 +1,8 @@ import { Component, Host, Input, OnInit, forwardRef } from '@angular/core'; -import { source, TileLoadFunctionType } from 'openlayers'; +import { BingMaps } from 'ol/source'; import { SourceComponent } from './source.component'; import { LayerTileComponent } from '../layers/layertile.component'; +import { TileLoadFunction } from '../../ol-models'; @Component({ selector: 'aol-source-bingmaps', @@ -9,7 +10,7 @@ import { LayerTileComponent } from '../layers/layertile.component'; providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceBingmapsComponent) }], }) export class SourceBingmapsComponent extends SourceComponent implements OnInit { - instance: source.BingMaps; + instance: BingMaps; @Input() cacheSize: number; @@ -26,7 +27,7 @@ export class SourceBingmapsComponent extends SourceComponent implements OnInit { @Input() reprojectionErrorThreshold: number; @Input() - tileLoadFunction: TileLoadFunctionType; + tileLoadFunction: TileLoadFunction; @Input() wrapX: boolean; @@ -35,7 +36,7 @@ export class SourceBingmapsComponent extends SourceComponent implements OnInit { } ngOnInit() { - this.instance = new source.BingMaps(this); + this.instance = new BingMaps(this); this.host.instance.setSource(this.instance); } } diff --git a/projects/ngx-openlayers/src/lib/sources/cluster.component.ts b/projects/ngx-openlayers/src/lib/sources/cluster.component.ts index 1f6bf074..6f995749 100644 --- a/projects/ngx-openlayers/src/lib/sources/cluster.component.ts +++ b/projects/ngx-openlayers/src/lib/sources/cluster.component.ts @@ -1,8 +1,10 @@ import { Component, Host, Input, forwardRef, ContentChild, AfterContentInit } from '@angular/core'; -import { source, Feature, geom } from 'openlayers'; +import { Feature } from 'ol'; import { LayerVectorComponent } from '../layers/layervector.component'; import { SourceComponent } from './source.component'; import { SourceVectorComponent } from './vector.component'; +import { Cluster, Vector } from 'ol/source'; +import { Point } from 'ol/geom'; @Component({ selector: 'aol-source-cluster', @@ -10,16 +12,16 @@ import { SourceVectorComponent } from './vector.component'; providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceClusterComponent) }], }) export class SourceClusterComponent extends SourceComponent implements AfterContentInit { - instance: source.Cluster; + instance: Cluster; @Input() distance: number; @Input() - geometryFunction?: ((feature: Feature) => geom.Point); + geometryFunction?: ((feature: Feature) => Point); @ContentChild(SourceVectorComponent) sourceVectorComponent: SourceVectorComponent; - source: source.Vector; + source: Vector; constructor(@Host() layer: LayerVectorComponent) { super(layer); @@ -28,7 +30,7 @@ export class SourceClusterComponent extends SourceComponent implements AfterCont ngAfterContentInit() { this.source = this.sourceVectorComponent.instance; - this.instance = new source.Cluster(this); + this.instance = new Cluster(this); this.host.instance.setSource(this.instance); } } diff --git a/projects/ngx-openlayers/src/lib/sources/geojson.component.ts b/projects/ngx-openlayers/src/lib/sources/geojson.component.ts index a20b56ff..ab543125 100644 --- a/projects/ngx-openlayers/src/lib/sources/geojson.component.ts +++ b/projects/ngx-openlayers/src/lib/sources/geojson.component.ts @@ -1,7 +1,10 @@ import { Component, Host, Input, OnInit, forwardRef } from '@angular/core'; -import { source, ProjectionLike, format } from 'openlayers'; import { LayerVectorComponent } from '../layers/layervector.component'; import { SourceComponent } from './source.component'; +import { Feature } from 'ol'; +import { Vector } from 'ol/source'; +import { ProjectionLike } from '../../ol-models'; +import { GeoJSON } from 'ol/format'; @Component({ selector: 'aol-source-geojson', @@ -9,8 +12,8 @@ import { SourceComponent } from './source.component'; providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceGeoJSONComponent) }], }) export class SourceGeoJSONComponent extends SourceComponent implements OnInit { - instance: source.Vector; - format: format.Feature; + instance: Vector; + format: Feature; @Input() defaultDataProjection: ProjectionLike; @Input() @@ -25,8 +28,8 @@ export class SourceGeoJSONComponent extends SourceComponent implements OnInit { } ngOnInit() { - this.format = new format.GeoJSON(this); - this.instance = new source.Vector(this); + this.format = new GeoJSON(this); + this.instance = new Vector(this); this.host.instance.setSource(this.instance); } } diff --git a/projects/ngx-openlayers/src/lib/sources/imagestatic.component.ts b/projects/ngx-openlayers/src/lib/sources/imagestatic.component.ts index 51313ff2..3c4b5085 100644 --- a/projects/ngx-openlayers/src/lib/sources/imagestatic.component.ts +++ b/projects/ngx-openlayers/src/lib/sources/imagestatic.component.ts @@ -1,7 +1,8 @@ import { Component, Host, Input, OnInit, forwardRef } from '@angular/core'; -import { ProjectionLike, source, Extent, AttributionLike, ImageLoadFunctionType, Size } from 'openlayers'; +import { ImageStatic } from 'ol/source'; import { SourceComponent } from './source.component'; import { LayerImageComponent } from '../layers/layerimage.component'; +import { AttributionLike, Extent, ImageLoadFunction, ProjectionLike, Size } from '../../ol-models'; @Component({ selector: 'aol-source-imagestatic', @@ -9,7 +10,7 @@ import { LayerImageComponent } from '../layers/layerimage.component'; providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceImageStaticComponent) }], }) export class SourceImageStaticComponent extends SourceComponent implements OnInit { - instance: source.ImageStatic; + instance: ImageStatic; @Input() projection: ProjectionLike | string; @@ -22,9 +23,9 @@ export class SourceImageStaticComponent extends SourceComponent implements OnIni @Input() crossOrigin?: string; @Input() - imageLoadFunction?: ImageLoadFunctionType; + imageLoadFunction?: ImageLoadFunction; @Input() - logo?: string | olx.LogoOptions; + logo?: string; // TODO: (string | olx.LogoOptions); @Input() imageSize?: Size; @@ -33,7 +34,7 @@ export class SourceImageStaticComponent extends SourceComponent implements OnIni } ngOnInit() { - this.instance = new source.ImageStatic(this); + this.instance = new ImageStatic(this); this.host.instance.setSource(this.instance); } } diff --git a/projects/ngx-openlayers/src/lib/sources/imagewms.component.ts b/projects/ngx-openlayers/src/lib/sources/imagewms.component.ts index 3688e986..6862679f 100644 --- a/projects/ngx-openlayers/src/lib/sources/imagewms.component.ts +++ b/projects/ngx-openlayers/src/lib/sources/imagewms.component.ts @@ -1,7 +1,8 @@ import { Component, Host, Input, OnInit, forwardRef } from '@angular/core'; -import { AttributionLike, ImageLoadFunctionType, ProjectionLike, source } from 'openlayers'; +import { ImageWMS } from 'ol/source'; import { LayerImageComponent } from '../layers/layerimage.component'; import { SourceComponent } from './source.component'; +import { AttributionLike, ImageLoadFunction, ProjectionLike } from '../../ol-models'; @Component({ selector: 'aol-source-imagewms', @@ -9,7 +10,7 @@ import { SourceComponent } from './source.component'; providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceImageWMSComponent) }], }) export class SourceImageWMSComponent extends SourceComponent implements OnInit { - instance: source.ImageWMS; + instance: ImageWMS; @Input() attributions: AttributionLike; @@ -20,9 +21,9 @@ export class SourceImageWMSComponent extends SourceComponent implements OnInit { @Input() serverType: string; @Input() - imageLoadFunction?: ImageLoadFunctionType; + imageLoadFunction?: ImageLoadFunction; @Input() - logo: string | olx.LogoOptions; + logo: string; // TODO: (string | olx.LogoOptions); @Input() params: Object; @Input() @@ -39,7 +40,7 @@ export class SourceImageWMSComponent extends SourceComponent implements OnInit { } ngOnInit() { - this.instance = new source.ImageWMS(this); + this.instance = new ImageWMS(this); this.host.instance.setSource(this.instance); } } diff --git a/projects/ngx-openlayers/src/lib/sources/osm.component.ts b/projects/ngx-openlayers/src/lib/sources/osm.component.ts index 31b2e168..2b403230 100644 --- a/projects/ngx-openlayers/src/lib/sources/osm.component.ts +++ b/projects/ngx-openlayers/src/lib/sources/osm.component.ts @@ -1,9 +1,10 @@ import { Component, Host, forwardRef, Input, AfterContentInit, Optional } from '@angular/core'; -import { source, AttributionLike, TileLoadFunctionType } from 'openlayers'; +import { OSM } from 'ol/source'; import { LayerTileComponent } from '../layers/layertile.component'; import { SourceComponent } from './source.component'; import { SourceXYZComponent } from './xyz.component'; import { SourceRasterComponent } from './raster.component'; +import { AttributionLike, TileLoadFunction } from '../../ol-models'; @Component({ selector: 'aol-source-osm', @@ -11,7 +12,7 @@ import { SourceRasterComponent } from './raster.component'; providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceOsmComponent) }], }) export class SourceOsmComponent extends SourceXYZComponent implements AfterContentInit { - instance: source.OSM; + instance: OSM; @Input() attributions: AttributionLike; @@ -26,7 +27,7 @@ export class SourceOsmComponent extends SourceXYZComponent implements AfterConte @Input() reprojectionErrorThreshold: number; @Input() - tileLoadFunction: TileLoadFunctionType; + tileLoadFunction: TileLoadFunction; @Input() url: string; @Input() @@ -47,7 +48,7 @@ export class SourceOsmComponent extends SourceXYZComponent implements AfterConte if (this.tileGridXYZ) { this.tileGrid = this.tileGridXYZ.instance; } - this.instance = new source.OSM(this); + this.instance = new OSM(this); this._register(this.instance); } } diff --git a/projects/ngx-openlayers/src/lib/sources/raster.component.ts b/projects/ngx-openlayers/src/lib/sources/raster.component.ts index 47a07fd2..aed32a8a 100644 --- a/projects/ngx-openlayers/src/lib/sources/raster.component.ts +++ b/projects/ngx-openlayers/src/lib/sources/raster.component.ts @@ -1,8 +1,9 @@ import { AfterContentInit, Component, EventEmitter, forwardRef, Host, Input, Output } from '@angular/core'; -import { RasterOperation, RasterOperationType, source } from 'openlayers'; - +import { Raster, Source } from 'ol/source'; +import { RasterOperationType, RasterSourceEvent } from 'ol/source/Raster'; import { LayerImageComponent } from '../layers/layerimage.component'; import { SourceComponent } from './source.component'; +import { RasterOperation } from '../../ol-models'; @Component({ selector: 'aol-source-raster', @@ -15,7 +16,7 @@ import { SourceComponent } from './source.component'; ], }) export class SourceRasterComponent extends SourceComponent implements AfterContentInit { - instance: source.Raster; + instance: Raster; @Input() operation?: RasterOperation; @@ -27,21 +28,21 @@ export class SourceRasterComponent extends SourceComponent implements AfterConte operationType?: RasterOperationType; @Output() - beforeOperations: EventEmitter = new EventEmitter(); + beforeOperations: EventEmitter = new EventEmitter(); @Output() - afterOperations: EventEmitter = new EventEmitter(); + afterOperations: EventEmitter = new EventEmitter(); - sources: source.Source[] = []; + sources: Source[] = []; constructor(@Host() layer: LayerImageComponent) { super(layer); } ngAfterContentInit() { - this.instance = new source.Raster(this); + this.instance = new Raster(this); - this.instance.on('beforeoperations', (event: source.RasterEvent) => this.beforeOperations.emit(event)); - this.instance.on('afteroperations', (event: source.RasterEvent) => this.afterOperations.emit(event)); + this.instance.on('beforeoperations', (event: RasterSourceEvent) => this.beforeOperations.emit(event)); + this.instance.on('afteroperations', (event: RasterSourceEvent) => this.afterOperations.emit(event)); this._register(this.instance); } diff --git a/projects/ngx-openlayers/src/lib/sources/source.component.ts b/projects/ngx-openlayers/src/lib/sources/source.component.ts index bc03454c..58d56a69 100644 --- a/projects/ngx-openlayers/src/lib/sources/source.component.ts +++ b/projects/ngx-openlayers/src/lib/sources/source.component.ts @@ -1,15 +1,14 @@ import { Input, OnDestroy } from '@angular/core'; -import { source } from 'openlayers'; +import { Source } from 'ol'; import { LayerComponent } from '../layers/layer.component'; -import AttributionLike = ol.AttributionLike; import { SourceRasterComponent } from './raster.component'; export class SourceComponent implements OnDestroy { - public instance: source.Source; + public instance: Source; public componentType = 'source'; @Input() - attributions: AttributionLike; + attributions: any; constructor(protected host: LayerComponent, protected raster?: SourceRasterComponent) {} @@ -23,7 +22,7 @@ export class SourceComponent implements OnDestroy { } } - protected _register(s: source.Source) { + protected _register(s: Source) { if (this.host) { this.host.instance.setSource(s); } diff --git a/projects/ngx-openlayers/src/lib/sources/tilejson.component.ts b/projects/ngx-openlayers/src/lib/sources/tilejson.component.ts index d1fa7476..10551ab0 100644 --- a/projects/ngx-openlayers/src/lib/sources/tilejson.component.ts +++ b/projects/ngx-openlayers/src/lib/sources/tilejson.component.ts @@ -1,5 +1,6 @@ import { Component, Host, Input, OnInit, forwardRef } from '@angular/core'; -import { source } from 'openlayers'; +import { TileJSON } from 'ol/source'; +import { TileGrid } from 'ol/tilegrid'; import { LayerTileComponent } from '../layers/layertile.component'; import { SourceComponent } from './source.component'; @@ -9,7 +10,7 @@ import { SourceComponent } from './source.component'; providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceTileJSONComponent) }], }) export class SourceTileJSONComponent extends SourceComponent implements OnInit { - instance: source.TileJSON; + instance: TileJSON; @Input() url: string; @@ -19,7 +20,7 @@ export class SourceTileJSONComponent extends SourceComponent implements OnInit { } ngOnInit() { - this.instance = new source.TileJSON(this); + this.instance = new TileJSON(this); this.host.instance.setSource(this.instance); } } diff --git a/projects/ngx-openlayers/src/lib/sources/tilewms.component.ts b/projects/ngx-openlayers/src/lib/sources/tilewms.component.ts index 0031d2e1..7289395d 100644 --- a/projects/ngx-openlayers/src/lib/sources/tilewms.component.ts +++ b/projects/ngx-openlayers/src/lib/sources/tilewms.component.ts @@ -1,7 +1,9 @@ import { Component, Host, Input, OnInit, forwardRef } from '@angular/core'; -import { source, TileLoadFunctionType, tilegrid } from 'openlayers'; import { LayerTileComponent } from '../layers/layertile.component'; import { SourceComponent } from './source.component'; +import { TileWMS } from 'ol/source'; +import { TileGrid } from 'ol/tilegrid'; +import { TileLoadFunction } from '../../ol-models'; @Component({ selector: 'aol-source-tilewms', @@ -9,7 +11,7 @@ import { SourceComponent } from './source.component'; providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceTileWMSComponent) }], }) export class SourceTileWMSComponent extends SourceComponent implements OnInit { - instance: source.TileWMS; + instance: TileWMS; @Input() cacheSize: number; @Input() @@ -27,9 +29,9 @@ export class SourceTileWMSComponent extends SourceComponent implements OnInit { @Input() serverType: string; @Input() - tileGrid: tilegrid.TileGrid; + tileGrid: TileGrid; @Input() - tileLoadFunction: TileLoadFunctionType; + tileLoadFunction: TileLoadFunction; @Input() url: string; @Input() @@ -42,7 +44,7 @@ export class SourceTileWMSComponent extends SourceComponent implements OnInit { } ngOnInit() { - this.instance = new source.TileWMS(this); + this.instance = new TileWMS(this); this.host.instance.setSource(this.instance); } } diff --git a/projects/ngx-openlayers/src/lib/sources/tilewmts.component.ts b/projects/ngx-openlayers/src/lib/sources/tilewmts.component.ts index ed66f5c3..a9ff1693 100644 --- a/projects/ngx-openlayers/src/lib/sources/tilewmts.component.ts +++ b/projects/ngx-openlayers/src/lib/sources/tilewmts.component.ts @@ -8,10 +8,13 @@ import { SimpleChanges, OnChanges, } from '@angular/core'; -import { TileLoadFunctionType, tilegrid, ProjectionLike, source, ImageTile, TileCoord, Tile } from 'openlayers'; import { LayerTileComponent } from '../layers/layertile.component'; import { SourceComponent } from './source.component'; import { TileGridWMTSComponent } from '../tilegridwmts.component'; +import { WMTS } from 'ol/source'; +import { WMTS as TileGridWMTS } from 'ol/tilegrid'; +import { WMTSRequestEncoding } from 'ol/source'; +import { ProjectionLike, TileCoord, TileLoadFunction } from '../../ol-models'; @Component({ selector: 'aol-source-tilewmts', @@ -19,34 +22,34 @@ import { TileGridWMTSComponent } from '../tilegridwmts.component'; providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceTileWMTSComponent) }], }) export class SourceTileWMTSComponent extends SourceComponent implements AfterContentInit, OnChanges { - instance: source.WMTS; + instance: WMTS; @Input() cacheSize?: number; @Input() crossOrigin?: string; @Input() - logo?: string | olx.LogoOptions; + logo?: string; // TODO: string | olx.LogoOptions; @Input() - tileGrid: tilegrid.WMTS; + tileGrid: TileGridWMTS; @Input() projection: ProjectionLike; @Input() reprojectionErrorThreshold?: number; @Input() - requestEncoding?: source.WMTSRequestEncoding | string; + requestEncoding?: WMTSRequestEncoding | string; @Input() layer: string; @Input() style: string; @Input() - tileClass?: (( + tileClass?: any; /* TODO: (( n: ImageTile, coords: TileCoord, state: Tile.State, s1: string, s2: string, - type: TileLoadFunctionType - ) => any); + type: TileLoadFunction + ) => any);*/ @Input() tilePixelRatio?: number; @Input() @@ -56,11 +59,11 @@ export class SourceTileWMTSComponent extends SourceComponent implements AfterCon @Input() matrixSet: string; @Input() - dimensions?: GlobalObject; + dimensions?: Object; // TODO: GlobalObject; @Input() url?: string; @Input() - tileLoadFunction?: TileLoadFunctionType; + tileLoadFunction?: TileLoadFunction; @Input() urls?: string[]; @Input() @@ -95,7 +98,7 @@ export class SourceTileWMTSComponent extends SourceComponent implements AfterCon } setLayerSource(): void { - this.instance = new source.WMTS(this); + this.instance = new WMTS(this); this.host.instance.setSource(this.instance); } diff --git a/projects/ngx-openlayers/src/lib/sources/vector.component.ts b/projects/ngx-openlayers/src/lib/sources/vector.component.ts index 0a992abf..95f6eb71 100644 --- a/projects/ngx-openlayers/src/lib/sources/vector.component.ts +++ b/projects/ngx-openlayers/src/lib/sources/vector.component.ts @@ -1,7 +1,9 @@ import { Component, Host, Input, OnInit, forwardRef } from '@angular/core'; -import { source } from 'openlayers'; +import { Vector } from 'ol/source'; +import Feature from 'ol/format/Feature'; import { LayerVectorComponent } from '../layers/layervector.component'; import { SourceComponent } from './source.component'; +import { LoadingStrategy } from '../../ol-models'; @Component({ selector: 'aol-source-vector', @@ -9,7 +11,7 @@ import { SourceComponent } from './source.component'; providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceVectorComponent) }], }) export class SourceVectorComponent extends SourceComponent implements OnInit { - instance: source.Vector; + instance: Vector; @Input() overlaps: boolean; @Input() @@ -19,16 +21,16 @@ export class SourceVectorComponent extends SourceComponent implements OnInit { @Input() url: string; @Input() - format: ol.format.Feature; + format: Feature; @Input() - strategy: ol.LoadingStrategy; + strategy: LoadingStrategy; constructor(@Host() layer: LayerVectorComponent) { super(layer); } ngOnInit() { - this.instance = new source.Vector(this); + this.instance = new Vector(this); this.host.instance.setSource(this.instance); } } diff --git a/projects/ngx-openlayers/src/lib/sources/vectortile.component.ts b/projects/ngx-openlayers/src/lib/sources/vectortile.component.ts index fe853f31..814559a1 100644 --- a/projects/ngx-openlayers/src/lib/sources/vectortile.component.ts +++ b/projects/ngx-openlayers/src/lib/sources/vectortile.component.ts @@ -1,9 +1,12 @@ import { Component, Host, Input, forwardRef, ContentChild, AfterContentInit } from '@angular/core'; -import { source, ProjectionLike, TileUrlFunctionType, format, tilegrid } from 'openlayers'; +import { VectorTile } from 'ol'; +import Feature from 'ol/format/Feature'; +import TileGrid from 'ol/tilegrid/TileGrid'; import { LayerVectorTileComponent } from '../layers/layervectortile.component'; import { FormatComponent } from '../formats/format.component'; import { TileGridComponent } from '../tilegrid.component'; import { SourceComponent } from './source.component'; +import { ProjectionLike, TileUrlFunction } from '../../ol-models'; @Component({ selector: 'aol-source-vectortile', @@ -11,7 +14,7 @@ import { SourceComponent } from './source.component'; providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceVectorTileComponent) }], }) export class SourceVectorTileComponent extends SourceComponent implements AfterContentInit { - public instance: source.VectorTile; + public instance: VectorTile; @Input() cacheSize: number; @Input() @@ -21,7 +24,7 @@ export class SourceVectorTileComponent extends SourceComponent implements AfterC @Input() tilePixelRatio: number; @Input() - tileUrlFunction: TileUrlFunctionType; + tileUrlFunction: TileUrlFunction; @Input() url: string; @Input() @@ -31,10 +34,10 @@ export class SourceVectorTileComponent extends SourceComponent implements AfterC @ContentChild(FormatComponent) formatComponent: FormatComponent; - format: format.Feature; + format: Feature; @ContentChild(TileGridComponent) tileGridComponent: TileGridComponent; - tileGrid: tilegrid.TileGrid; + tileGrid: TileGrid; constructor(@Host() layer: LayerVectorTileComponent) { super(layer); @@ -45,7 +48,7 @@ export class SourceVectorTileComponent extends SourceComponent implements AfterC this.format = this.formatComponent.instance; this.tileGrid = this.tileGridComponent.instance; // console.log('creating ol.source.VectorTile instance with:', this); - this.instance = new source.VectorTile(this); + this.instance = new VectorTile(this); this.host.instance.setSource(this.instance); } } diff --git a/projects/ngx-openlayers/src/lib/sources/xyz.component.ts b/projects/ngx-openlayers/src/lib/sources/xyz.component.ts index 53a3903b..051490b1 100644 --- a/projects/ngx-openlayers/src/lib/sources/xyz.component.ts +++ b/projects/ngx-openlayers/src/lib/sources/xyz.component.ts @@ -9,9 +9,10 @@ import { SimpleChanges, Optional, } from '@angular/core'; -import { source, Size, TileUrlFunctionType, TileLoadFunctionType, tilegrid } from 'openlayers'; +import { XYZ } from 'ol/source'; import { LayerTileComponent } from '../layers/layertile.component'; import { SourceComponent } from './source.component'; +import { Size } from '../../ol-models'; import { TileGridComponent } from '../tilegrid.component'; import { SourceRasterComponent } from './raster.component'; @@ -21,7 +22,7 @@ import { SourceRasterComponent } from './raster.component'; providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceXYZComponent) }], }) export class SourceXYZComponent extends SourceComponent implements AfterContentInit, OnChanges { - instance: source.XYZ; + instance: XYZ; @Input() cacheSize: number; @Input() @@ -37,15 +38,15 @@ export class SourceXYZComponent extends SourceComponent implements AfterContentI @Input() maxZoom: number; @Input() - tileGrid: tilegrid.TileGrid; + tileGrid: any; @Input() - tileLoadFunction?: TileLoadFunctionType; + tileLoadFunction?: any; @Input() tilePixelRatio: number; @Input() tileSize: number | Size; @Input() - tileUrlFunction: TileUrlFunctionType; + tileUrlFunction: any; @Input() url: string; @Input() @@ -71,7 +72,7 @@ export class SourceXYZComponent extends SourceComponent implements AfterContentI if (this.tileGridXYZ) { this.tileGrid = this.tileGridXYZ.instance; } - this.instance = new source.XYZ(this); + this.instance = new XYZ(this); this._register(this.instance); } @@ -89,7 +90,7 @@ export class SourceXYZComponent extends SourceComponent implements AfterContentI this.instance.setProperties(properties, false); if (changes.hasOwnProperty('url')) { - this.instance = new source.XYZ(this); + this.instance = new XYZ(this); this._register(this.instance); } } diff --git a/projects/ngx-openlayers/src/lib/styles/circle.component.ts b/projects/ngx-openlayers/src/lib/styles/circle.component.ts index 9561c40d..2201ab57 100644 --- a/projects/ngx-openlayers/src/lib/styles/circle.component.ts +++ b/projects/ngx-openlayers/src/lib/styles/circle.component.ts @@ -1,5 +1,5 @@ import { Component, Input, Host, AfterContentInit, OnChanges, OnDestroy, SimpleChanges } from '@angular/core'; -import { style } from 'openlayers'; +import { AtlasManager, Circle, Fill, Stroke } from 'ol/style'; import { StyleComponent } from './style.component'; @Component({ @@ -8,18 +8,18 @@ import { StyleComponent } from './style.component'; }) export class StyleCircleComponent implements AfterContentInit, OnChanges, OnDestroy { public componentType = 'style-circle'; - public instance: style.Circle; + public instance: Circle; @Input() - fill: style.Fill; + fill: Fill; @Input() radius: number; @Input() snapToPixel: boolean; @Input() - stroke: style.Stroke; + stroke: Stroke; @Input() - atlasManager: style.AtlasManager; + atlasManager: AtlasManager; constructor(@Host() private host: StyleComponent) {} @@ -38,7 +38,7 @@ export class StyleCircleComponent implements AfterContentInit, OnChanges, OnDest ngAfterContentInit() { // console.log('creating ol.style.Circle instance with: ', this); - this.instance = new style.Circle(this); + this.instance = new Circle(this); this.host.instance.setImage(this.instance); this.host.update(); } diff --git a/projects/ngx-openlayers/src/lib/styles/fill.component.ts b/projects/ngx-openlayers/src/lib/styles/fill.component.ts index aacecd7e..65557ca0 100644 --- a/projects/ngx-openlayers/src/lib/styles/fill.component.ts +++ b/projects/ngx-openlayers/src/lib/styles/fill.component.ts @@ -1,8 +1,9 @@ import { Component, Input, Optional, OnInit, OnChanges, SimpleChanges } from '@angular/core'; -import { style, Color, ColorLike } from 'openlayers'; +import { Fill } from 'ol/style'; import { StyleComponent } from './style.component'; import { StyleCircleComponent } from './circle.component'; import { StyleTextComponent } from './text.component'; +import { Color, ColorLike } from '../../ol-models'; @Component({ selector: 'aol-style-fill', @@ -11,7 +12,7 @@ import { StyleTextComponent } from './text.component'; export class StyleFillComponent implements OnInit, OnChanges { /* the typings do not have the setters */ private host: /*StyleComponent|StyleCircleComponent|StyleTextComponent*/ any; - public instance: style.Fill; + public instance: Fill; @Input() color: Color | ColorLike; @@ -36,7 +37,7 @@ export class StyleFillComponent implements OnInit, OnChanges { ngOnInit() { // console.log('creating ol.style.Fill instance with: ', this); - this.instance = new style.Fill(this); + this.instance = new Fill(this); switch (this.host.componentType) { case 'style': this.host.instance.setFill(this.instance); diff --git a/projects/ngx-openlayers/src/lib/styles/icon.component.ts b/projects/ngx-openlayers/src/lib/styles/icon.component.ts index 930ac382..41a20d77 100644 --- a/projects/ngx-openlayers/src/lib/styles/icon.component.ts +++ b/projects/ngx-openlayers/src/lib/styles/icon.component.ts @@ -1,5 +1,7 @@ import { Component, Input, Host, OnInit, OnChanges, SimpleChanges } from '@angular/core'; -import { style } from 'openlayers'; +import { Icon } from 'ol/style'; +import IconAnchorUnits from 'ol/style/IconAnchorUnits'; +import IconOrigin from 'ol/style/IconOrigin'; import { StyleComponent } from './style.component'; @Component({ @@ -7,26 +9,26 @@ import { StyleComponent } from './style.component'; template: `
`, }) export class StyleIconComponent implements OnInit, OnChanges { - public instance: style.Icon; + public instance: Icon; @Input() anchor: [number, number]; @Input() - anchorXUnits: style.IconAnchorUnits; + anchorXUnits: IconAnchorUnits; @Input() - anchorYUnits: style.IconAnchorUnits; + anchorYUnits: IconAnchorUnits; @Input() - anchorOrigin: style.IconOrigin; + anchorOrigin: IconOrigin; @Input() color: [number, number, number, number]; @Input() - crossOrigin: style.IconOrigin; + crossOrigin: IconOrigin; @Input() img: string; @Input() offset: [number, number]; @Input() - offsetOrigin: style.IconOrigin; + offsetOrigin: IconOrigin; @Input() opacity: number; @Input() @@ -48,7 +50,7 @@ export class StyleIconComponent implements OnInit, OnChanges { ngOnInit() { // console.log('creating ol.style.Icon instance with: ', this); - this.instance = new style.Icon(this); + this.instance = new Icon(this); this.host.instance.setImage(this.instance); } @@ -66,7 +68,7 @@ export class StyleIconComponent implements OnInit, OnChanges { this.instance.setScale(changes['scale'].currentValue); } if (changes['src']) { - this.instance = new style.Icon(this); + this.instance = new Icon(this); this.host.instance.setImage(this.instance); } this.host.update(); diff --git a/projects/ngx-openlayers/src/lib/styles/stroke.component.ts b/projects/ngx-openlayers/src/lib/styles/stroke.component.ts index 81a3734d..cfb4193b 100644 --- a/projects/ngx-openlayers/src/lib/styles/stroke.component.ts +++ b/projects/ngx-openlayers/src/lib/styles/stroke.component.ts @@ -1,15 +1,16 @@ import { Component, Input, Optional, OnInit, OnChanges, SimpleChanges } from '@angular/core'; -import { style, Color } from 'openlayers'; +import { Stroke } from 'ol/style'; import { StyleComponent } from './style.component'; import { StyleCircleComponent } from './circle.component'; import { StyleTextComponent } from './text.component'; +import { Color } from '../../ol-models'; @Component({ selector: 'aol-style-stroke', template: `
`, }) export class StyleStrokeComponent implements OnInit, OnChanges { - public instance: style.Stroke; + public instance: Stroke; /* the typings do not have the setters */ private host: /*StyleComponent|StyleCircleComponent|StyleTextComponent*/ any; @@ -46,7 +47,7 @@ export class StyleStrokeComponent implements OnInit, OnChanges { ngOnInit() { // console.log('creating ol.style.Stroke instance with: ', this); - this.instance = new style.Stroke(this); + this.instance = new Stroke(this); switch (this.host.componentType) { case 'style': this.host.instance.setStroke(this.instance); diff --git a/projects/ngx-openlayers/src/lib/styles/style.component.ts b/projects/ngx-openlayers/src/lib/styles/style.component.ts index 86b119d0..c3d2df12 100644 --- a/projects/ngx-openlayers/src/lib/styles/style.component.ts +++ b/projects/ngx-openlayers/src/lib/styles/style.component.ts @@ -1,7 +1,9 @@ import { Component, Input, Optional, OnInit } from '@angular/core'; -import { style, StyleGeometryFunction, geom } from 'openlayers'; +import { Fill, Image, Stroke, Style, Text } from 'ol/style'; +import { Geometry } from 'ol/geom'; import { FeatureComponent } from '../feature.component'; import { LayerVectorComponent } from '../layers/layervector.component'; +import { StyleGeometryFunction } from '../../ol-models'; @Component({ selector: 'aol-style', @@ -9,19 +11,19 @@ import { LayerVectorComponent } from '../layers/layervector.component'; }) export class StyleComponent implements OnInit { private host: FeatureComponent | LayerVectorComponent; - public instance: style.Style; + public instance: Style; public componentType = 'style'; @Input() - geometry: string | geom.Geometry | StyleGeometryFunction; + geometry: string | Geometry | StyleGeometryFunction; @Input() - fill: style.Fill; + fill: Fill; @Input() - image: style.Image; + image: Image; @Input() - stroke: style.Stroke; + stroke: Stroke; @Input() - text: style.Text; + text: Text; @Input() zIndex: number; @@ -40,7 +42,7 @@ export class StyleComponent implements OnInit { ngOnInit() { // console.log('creating aol-style instance with: ', this); - this.instance = new style.Style(this); + this.instance = new Style(this); this.host.instance.setStyle(this.instance); } } diff --git a/projects/ngx-openlayers/src/lib/styles/text.component.ts b/projects/ngx-openlayers/src/lib/styles/text.component.ts index 84bcd2a1..3bcab0d9 100644 --- a/projects/ngx-openlayers/src/lib/styles/text.component.ts +++ b/projects/ngx-openlayers/src/lib/styles/text.component.ts @@ -1,5 +1,5 @@ import { Component, Input, Optional, OnInit, OnChanges, SimpleChanges } from '@angular/core'; -import { style } from 'openlayers'; +import { Text } from 'ol/style'; import { StyleComponent } from './style.component'; @Component({ @@ -7,7 +7,7 @@ import { StyleComponent } from './style.component'; template: `
`, }) export class StyleTextComponent implements OnInit, OnChanges { - public instance: style.Text; + public instance: Text; public componentType = 'style-text'; @Input() @@ -38,7 +38,7 @@ export class StyleTextComponent implements OnInit, OnChanges { ngOnInit() { // console.log('creating ol.style.Text instance with: ', this); - this.instance = new style.Text(this); + this.instance = new Text(this); this.host.instance.setText(this.instance); } diff --git a/projects/ngx-openlayers/src/lib/tilegrid.component.ts b/projects/ngx-openlayers/src/lib/tilegrid.component.ts index b87b6dd8..8940752d 100644 --- a/projects/ngx-openlayers/src/lib/tilegrid.component.ts +++ b/projects/ngx-openlayers/src/lib/tilegrid.component.ts @@ -1,12 +1,14 @@ import { Component, Input, OnChanges, OnInit, SimpleChanges } from '@angular/core'; -import { tilegrid, Extent, Size, Coordinate } from 'openlayers'; +import { createXYZ } from 'ol/tilegrid'; +import TileGrid from 'ol/tilegrid/TileGrid'; +import { Coordinate, Extent, Size } from '../ol-models'; @Component({ selector: 'aol-tilegrid', template: '', }) export class TileGridComponent implements OnInit, OnChanges { - instance: tilegrid.TileGrid; + instance: TileGrid; @Input() extent: Extent; @@ -23,17 +25,17 @@ export class TileGridComponent implements OnInit, OnChanges { ngOnInit() { if (!this.resolutions) { - this.instance = tilegrid.createXYZ(this); + this.instance = createXYZ(this); } else { - this.instance = new tilegrid.TileGrid(this); + this.instance = new TileGrid(this); } } ngOnChanges(changes: SimpleChanges) { if (!this.resolutions) { - this.instance = tilegrid.createXYZ(this); + this.instance = createXYZ(this); } else { - this.instance = new tilegrid.TileGrid(this); + this.instance = new TileGrid(this); } } } diff --git a/projects/ngx-openlayers/src/lib/tilegridwmts.component.ts b/projects/ngx-openlayers/src/lib/tilegridwmts.component.ts index 150eebd5..df10444e 100644 --- a/projects/ngx-openlayers/src/lib/tilegridwmts.component.ts +++ b/projects/ngx-openlayers/src/lib/tilegridwmts.component.ts @@ -1,13 +1,14 @@ import { Component, Input, OnInit } from '@angular/core'; -import { tilegrid, Size, Coordinate } from 'openlayers'; +import WMTS from 'ol/tilegrid/WMTS'; import { TileGridComponent } from './tilegrid.component'; +import { Coordinate, Size } from '../ol-models'; @Component({ selector: 'aol-tilegrid-wmts', template: '', }) export class TileGridWMTSComponent extends TileGridComponent implements OnInit { - instance: tilegrid.WMTS; + instance: WMTS; @Input() origin?: Coordinate; @@ -25,6 +26,6 @@ export class TileGridWMTSComponent extends TileGridComponent implements OnInit { widths?: number[]; ngOnInit() { - this.instance = new tilegrid.WMTS(this); + this.instance = new WMTS(this); } } diff --git a/projects/ngx-openlayers/src/lib/view.component.ts b/projects/ngx-openlayers/src/lib/view.component.ts index 9fad63d9..9ee7529e 100644 --- a/projects/ngx-openlayers/src/lib/view.component.ts +++ b/projects/ngx-openlayers/src/lib/view.component.ts @@ -1,6 +1,7 @@ import { Component, Input, OnInit, OnChanges, OnDestroy, SimpleChanges } from '@angular/core'; -import { View, Extent, Coordinate } from 'openlayers'; +import View from 'ol/View'; import { MapComponent } from './map.component'; +import {Coordinate, Extent} from '../ol-models'; @Component({ selector: 'aol-view', diff --git a/projects/ngx-openlayers/src/ol-models.ts b/projects/ngx-openlayers/src/ol-models.ts new file mode 100644 index 00000000..25b3225f --- /dev/null +++ b/projects/ngx-openlayers/src/ol-models.ts @@ -0,0 +1,57 @@ +/** + * This model should be temporary. It is here to compensate the lack of typings for ol library. + * Such work is beeing done on OpenLayers side (see https://github.com/openlayers/openlayers/pull/8345) + */ + +import { Feature, Image, Tile } from 'ol'; +import { Style } from 'ol/style'; +import { Layer } from 'ol/layer'; +import { Geometry } from 'ol/geom'; +import MapBrowserEvent from 'ol/MapBrowserEvent'; + + +export type Extent = [number, number, number, number]; + +export type Coordinate = [number, number]; + +export type CoordinateFormat = (coord: Coordinate) => string; + +export type ProjectionLike = string; + +export type StyleFunction = (feature: Feature, resolution: number) => Style | Array