AW-6046 ng-openlayers
This commit is contained in:
		
							
								
								
									
										4
									
								
								projects/common-map/package-lock.json
									
									
									
										generated
									
									
									
								
							
							
						
						
									
										4
									
								
								projects/common-map/package-lock.json
									
									
									
										generated
									
									
									
								
							| @@ -15,10 +15,10 @@ | ||||
|         "@ngrx/effects": "^17", | ||||
|         "@ngrx/router-store": "^17", | ||||
|         "@ngrx/store": "^17", | ||||
|         "ng-openlayers": "file:dist/ng-openlayers", | ||||
|         "ng-openlayers": "17.1.3", | ||||
|         "ngrx-store-localstorage": "^17", | ||||
|         "ol": "^8.2.0", | ||||
|         "tassign": ">1.0.0" | ||||
|         "tassign": "^1.0.0" | ||||
|       } | ||||
|     }, | ||||
|     "node_modules/tslib": { | ||||
|   | ||||
| @@ -14,7 +14,7 @@ | ||||
|     "@ngrx/router-store": "^17", | ||||
|     "@ngrx/store": "^17", | ||||
|     "tassign": "^1.0.0", | ||||
|     "ng-openlayers": "file:dist/ng-openlayers", | ||||
|     "ng-openlayers": "17.1.3", | ||||
|     "ol": "^8.2.0" | ||||
|   } | ||||
| } | ||||
|   | ||||
							
								
								
									
										6
									
								
								projects/common-map3d/package-lock.json
									
									
									
										generated
									
									
									
								
							
							
						
						
									
										6
									
								
								projects/common-map3d/package-lock.json
									
									
									
										generated
									
									
									
								
							| @@ -11,10 +11,10 @@ | ||||
|         "tslib": "^2.0.0" | ||||
|       }, | ||||
|       "peerDependencies": { | ||||
|         "@angular/common": "^16.2.12", | ||||
|         "@angular/core": "^16.2.12", | ||||
|         "@angular/common": "^17.3.3", | ||||
|         "@angular/core": "^17.3.3", | ||||
|         "cesium": ">=1.82.1", | ||||
|         "ng-openlayers": "file:dist/ng-openlayers", | ||||
|         "ng-openlayers": "17.1.3", | ||||
|         "ol-cesium": ">=2.13.0" | ||||
|       } | ||||
|     }, | ||||
|   | ||||
| @@ -7,7 +7,7 @@ | ||||
|   "peerDependencies": { | ||||
|     "@angular/common":  "^17.3.3", | ||||
|     "@angular/core":  "^17.3.3", | ||||
|     "ng-openlayers": "file:dist/ng-openlayers", | ||||
|     "ng-openlayers": "17.1.3", | ||||
|     "cesium": ">=1.82.1", | ||||
|     "ol-cesium": ">=2.13.0" | ||||
|   }, | ||||
|   | ||||
							
								
								
									
										8
									
								
								projects/common/package-lock.json
									
									
									
										generated
									
									
									
								
							
							
						
						
									
										8
									
								
								projects/common/package-lock.json
									
									
									
										generated
									
									
									
								
							| @@ -11,7 +11,7 @@ | ||||
|         "@angular/common": "^17.3.3", | ||||
|         "@angular/core": "^17.3.3", | ||||
|         "@angular/forms": "^17.3.3", | ||||
|         "@microsoft/signalr": ">3.1.3", | ||||
|         "@microsoft/signalr": "^3.1.16", | ||||
|         "@ng-bootstrap/ng-bootstrap": "^16.0.0", | ||||
|         "@ngrx/effects": "^17", | ||||
|         "@ngrx/router-store": "^17", | ||||
| @@ -20,10 +20,10 @@ | ||||
|         "bootstrap": "^5.2.0", | ||||
|         "moment": "^2.29.4", | ||||
|         "ngx-avatars": "1.7.0", | ||||
|         "ngx-clipboard": ">15.1.0", | ||||
|         "ngx-image-cropper": ">7.2.1", | ||||
|         "ngx-clipboard": "16.0.0", | ||||
|         "ngx-image-cropper": "^7.2.1", | ||||
|         "ngx-uploadx": "^6.2.0", | ||||
|         "tassign": ">1.0.0" | ||||
|         "tassign": "^1.0.0" | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|   | ||||
| @@ -1,54 +0,0 @@ | ||||
| { | ||||
|   "extends": "../../.eslintrc.json", | ||||
|   "ignorePatterns": [ | ||||
|     "!**/*" | ||||
|   ], | ||||
|   "overrides": [ | ||||
|     { | ||||
|       "files": [ | ||||
|         "*.ts" | ||||
|       ], | ||||
|       "parserOptions": { | ||||
|         "project": [ | ||||
|           "libs/ng-openlayers/tsconfig.*?.json" | ||||
|         ], | ||||
|         "createDefaultProgram": true | ||||
|       }, | ||||
|       "rules": { | ||||
|         "@angular-eslint/component-selector": [ | ||||
|           "error", | ||||
|           { | ||||
|             "type": "element", | ||||
|             "prefix": "aol", | ||||
|             "style": "kebab-case" | ||||
|           } | ||||
|         ], | ||||
|         "@angular-eslint/directive-selector": [ | ||||
|           "error", | ||||
|           { | ||||
|             "type": "attribute", | ||||
|             "prefix": "aol", | ||||
|             "style": "camelCase" | ||||
|           } | ||||
|         ], | ||||
|         "@typescript-eslint/explicit-member-accessibility": [ | ||||
|           "off", | ||||
|           { | ||||
|             "accessibility": "explicit" | ||||
|           } | ||||
|         ], | ||||
|         "arrow-parens": [ | ||||
|           "off", | ||||
|           "always" | ||||
|         ], | ||||
|         "import/order": "off" | ||||
|       } | ||||
|     }, | ||||
|     { | ||||
|       "files": [ | ||||
|         "*.html" | ||||
|       ], | ||||
|       "rules": {} | ||||
|     } | ||||
|   ] | ||||
| } | ||||
							
								
								
									
										2
									
								
								projects/ng-openlayers/.gitignore
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										2
									
								
								projects/ng-openlayers/.gitignore
									
									
									
									
										vendored
									
									
								
							| @@ -1,2 +0,0 @@ | ||||
| /node_modules | ||||
|  | ||||
| @@ -1,32 +0,0 @@ | ||||
| // Karma configuration file, see link for more information | ||||
| // https://karma-runner.github.io/1.0/config/configuration-file.html | ||||
|  | ||||
| module.exports = function (config) { | ||||
|   config.set({ | ||||
|     basePath: '', | ||||
|     frameworks: ['jasmine', '@angular-devkit/build-angular'], | ||||
|     plugins: [ | ||||
|       require('karma-jasmine'), | ||||
|       require('karma-chrome-launcher'), | ||||
|       require('karma-jasmine-html-reporter'), | ||||
|       require('karma-coverage-istanbul-reporter'), | ||||
|       require('@angular-devkit/build-angular/plugins/karma'), | ||||
|     ], | ||||
|     client: { | ||||
|       clearContext: false, // leave Jasmine Spec Runner output visible in browser | ||||
|     }, | ||||
|     coverageIstanbulReporter: { | ||||
|       dir: require('path').join(__dirname, '../../coverage/ng-openlayers'), | ||||
|       reports: ['html', 'lcovonly', 'text-summary'], | ||||
|       fixWebpackSourcePaths: true, | ||||
|     }, | ||||
|     reporters: ['progress', 'kjhtml'], | ||||
|     port: 9876, | ||||
|     colors: true, | ||||
|     logLevel: config.LOG_INFO, | ||||
|     autoWatch: true, | ||||
|     browsers: ['Chrome'], | ||||
|     singleRun: false, | ||||
|     restartOnFileChange: true, | ||||
|   }); | ||||
| }; | ||||
| @@ -1,10 +0,0 @@ | ||||
| { | ||||
|   "$schema": "../../node_modules/ng-packagr/ng-package.schema.json", | ||||
|   "dest": "../../dist/ng-openlayers", | ||||
|   "assets": [ | ||||
|     "ngcc.config.js" | ||||
|   ], | ||||
|   "lib": { | ||||
|     "entryFile": "src/public-api.ts" | ||||
|   } | ||||
| } | ||||
| @@ -1,3 +0,0 @@ | ||||
| module.exports = { | ||||
|   ignorableDeepImportMatchers: [/ol\//], | ||||
| }; | ||||
							
								
								
									
										33
									
								
								projects/ng-openlayers/package-lock.json
									
									
									
										generated
									
									
									
								
							
							
						
						
									
										33
									
								
								projects/ng-openlayers/package-lock.json
									
									
									
										generated
									
									
									
								
							| @@ -1,33 +0,0 @@ | ||||
| { | ||||
|   "name": "ng-openlayers", | ||||
|   "version": "17.1.3", | ||||
|   "lockfileVersion": 2, | ||||
|   "requires": true, | ||||
|   "packages": { | ||||
|     "": { | ||||
|       "name": "ng-openlayers", | ||||
|       "version": "17.1.3", | ||||
|       "license": "MPL-2.0", | ||||
|       "dependencies": { | ||||
|         "tslib": "^2.3.0" | ||||
|       }, | ||||
|       "peerDependencies": { | ||||
|         "@angular/common": ">=17.0.0", | ||||
|         "@angular/core": ">=17.0.0", | ||||
|         "ol": "^8.2.0" | ||||
|       } | ||||
|     }, | ||||
|     "node_modules/tslib": { | ||||
|       "version": "2.6.2", | ||||
|       "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz", | ||||
|       "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==" | ||||
|     } | ||||
|   }, | ||||
|   "dependencies": { | ||||
|     "tslib": { | ||||
|       "version": "2.6.2", | ||||
|       "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz", | ||||
|       "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==" | ||||
|     } | ||||
|   } | ||||
| } | ||||
| @@ -1,38 +0,0 @@ | ||||
| { | ||||
|   "name": "ng-openlayers", | ||||
|   "version": "17.1.3", | ||||
|   "description": "OpenLayers library for Angular", | ||||
|   "author": "Kamil Furtak (kamil.furtak@gmail.com)", | ||||
|   "publishConfig": { | ||||
|     "registry": "https://repository.akkerweb.nl/repository/npm-hosted/" | ||||
|   }, | ||||
|   "bugs": { | ||||
|     "url": "https://github.com/kamilfurtak/ng-openlayers/issues" | ||||
|   }, | ||||
|   "homepage": "https://github.com/kamilfurtak/ng-openlayers", | ||||
|   "keywords": [ | ||||
|     "ngx-openlayers", | ||||
|     "angular", | ||||
|     "angular17", | ||||
|     "openlayers", | ||||
|     "openlayers8", | ||||
|     "ol8" | ||||
|   ], | ||||
|   "license": "MPL-2.0", | ||||
|   "private": false, | ||||
|   "scripts": { | ||||
|     "release": "standard-version -m \"chore(release): version %s\" -t \"\"", | ||||
|     "prepublishOnly": "cp projects/ng-openlayers/README.md dist/ng-openlayers/README.md" | ||||
|   }, | ||||
|   "standard-version": { | ||||
|     "postchangelog": "cp projects/ng-openlayers/CHANGELOG.md dist/ng-openlayers/CHANGELOG.md" | ||||
|   }, | ||||
|   "dependencies": { | ||||
|     "tslib": "^2.3.0" | ||||
|   }, | ||||
|   "peerDependencies": { | ||||
|     "@angular/common": ">=17.0.0", | ||||
|     "@angular/core": ">=17.0.0", | ||||
|     "ol": "^8.2.0" | ||||
|   } | ||||
| } | ||||
| @@ -1,38 +0,0 @@ | ||||
| { | ||||
|   "name": "ng-openlayers", | ||||
|   "$schema": "../../node_modules/nx/schemas/project-schema.json", | ||||
|   "projectType": "library", | ||||
|   "sourceRoot": "libs/ng-openlayers/src", | ||||
|   "prefix": "lib", | ||||
|   "targets": { | ||||
|     "build": { | ||||
|       "executor": "@nx/angular:package", | ||||
|       "options": { | ||||
|         "tsConfig": "libs/ng-openlayers/tsconfig.lib.json", | ||||
|         "project": "libs/ng-openlayers/ng-package.json" | ||||
|       }, | ||||
|       "configurations": { | ||||
|         "production": { | ||||
|           "tsConfig": "libs/ng-openlayers/tsconfig.lib.prod.json" | ||||
|         } | ||||
|       } | ||||
|     }, | ||||
|     "test": { | ||||
|       "executor": "@angular-devkit/build-angular:karma", | ||||
|       "options": { | ||||
|         "main": "libs/ng-openlayers/src/test.ts", | ||||
|         "tsConfig": "libs/ng-openlayers/tsconfig.spec.json", | ||||
|         "karmaConfig": "libs/ng-openlayers/karma.conf.js" | ||||
|       } | ||||
|     }, | ||||
|     "lint": { | ||||
|       "executor": "@nx/eslint:lint", | ||||
|       "options": { | ||||
|         "lintFilePatterns": [ | ||||
|           "libs/ng-openlayers/**/*.ts", | ||||
|           "libs/ng-openlayers/**/*.html" | ||||
|         ] | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| } | ||||
| @@ -1,15 +0,0 @@ | ||||
| import { Component, ElementRef, OnInit } from '@angular/core'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-attribution', | ||||
|   template: '<ng-content></ng-content>', | ||||
| }) | ||||
| export class AttributionComponent implements OnInit { | ||||
|   label: string; | ||||
|  | ||||
|   constructor(private elementRef: ElementRef) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.label = this.elementRef.nativeElement.innerHTML; | ||||
|   } | ||||
| } | ||||
| @@ -1,25 +0,0 @@ | ||||
| import { AfterViewInit, Component, ContentChildren, Host, QueryList } from '@angular/core'; | ||||
| import { SourceComponent } from './sources/source.component'; | ||||
| import { AttributionComponent } from './attribution.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-attributions', | ||||
|   template: '<ng-content></ng-content>', | ||||
| }) | ||||
| export class AttributionsComponent implements AfterViewInit { | ||||
|   @ContentChildren(AttributionComponent) | ||||
|   attributions: QueryList<AttributionComponent>; | ||||
|  | ||||
|   instance: Array<string>; | ||||
|  | ||||
|   constructor(@Host() private source: SourceComponent) {} | ||||
|  | ||||
|   /* we can do this at the very end */ | ||||
|   ngAfterViewInit() { | ||||
|     if (this.attributions.length) { | ||||
|       this.instance = this.attributions.map((cmp) => cmp.label); | ||||
|       // console.log('setting attributions:', this.instance); | ||||
|       this.source.instance.setAttributions(this.instance); | ||||
|     } | ||||
|   } | ||||
| } | ||||
| @@ -1,89 +0,0 @@ | ||||
| import { Component, Input, OnChanges, OnInit, Optional, SimpleChanges } from '@angular/core'; | ||||
| import { MapComponent } from './map.component'; | ||||
| import { GeometryLinestringComponent } from './geom/geometrylinestring.component'; | ||||
| import { GeometryPolygonComponent } from './geom/geometrypolygon.component'; | ||||
| import { GeometryMultiPointComponent } from './geom/geometrymultipoint.component'; | ||||
| import { GeometryMultiLinestringComponent } from './geom/geometrymultilinestring.component'; | ||||
| import { GeometryMultiPolygonComponent } from './geom/geometrymultipolygon.component'; | ||||
| import { Coordinate } from 'ol/coordinate'; | ||||
| import { transform } from 'ol/proj'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-collection-coordinates', | ||||
|   template: ` <div class="aol-collection-coordinates"></div> `, | ||||
| }) | ||||
| export class CollectionCoordinatesComponent implements OnChanges, OnInit { | ||||
|   @Input() | ||||
|   coordinates: Coordinate[] | Coordinate[][] | Coordinate[][][]; | ||||
|   @Input() | ||||
|   srid = 'EPSG:3857'; | ||||
|  | ||||
|   private host: any; | ||||
|   private mapSrid = 'EPSG:3857'; | ||||
|  | ||||
|   constructor( | ||||
|     private map: MapComponent, | ||||
|     @Optional() geometryLinestring: GeometryLinestringComponent, | ||||
|     @Optional() geometryPolygon: GeometryPolygonComponent, | ||||
|     @Optional() geometryMultipoint: GeometryMultiPointComponent, | ||||
|     @Optional() geometryMultilinestring: GeometryMultiLinestringComponent, | ||||
|     @Optional() geometryMultipolygon: GeometryMultiPolygonComponent | ||||
|   ) { | ||||
|     if (!!geometryLinestring) { | ||||
|       this.host = geometryLinestring; | ||||
|     } else if (!!geometryPolygon) { | ||||
|       this.host = geometryPolygon; | ||||
|     } else if (!!geometryMultipoint) { | ||||
|       this.host = geometryMultipoint; | ||||
|     } else if (!!geometryMultilinestring) { | ||||
|       this.host = geometryMultilinestring; | ||||
|     } else if (!!geometryMultipolygon) { | ||||
|       this.host = geometryMultipolygon; | ||||
|     } else { | ||||
|       throw new Error('aol-collection-coordinates must be a child of a geometry component'); | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.map.instance.on('change:view', (e) => this.onMapViewChanged(e)); | ||||
|     this.mapSrid = this.map.instance.getView().getProjection().getCode(); | ||||
|     this.transformCoordinates(); | ||||
|   } | ||||
|  | ||||
|   ngOnChanges(changes: SimpleChanges) { | ||||
|     this.transformCoordinates(); | ||||
|   } | ||||
|  | ||||
|   private onMapViewChanged(event) { | ||||
|     this.mapSrid = event.target.get(event.key).getProjection().getCode(); | ||||
|     this.transformCoordinates(); | ||||
|   } | ||||
|  | ||||
|   private transformCoordinates() { | ||||
|     let transformedCoordinates: Coordinate[] | Coordinate[][] | Coordinate[][][]; | ||||
|  | ||||
|     if (this.srid === this.mapSrid) { | ||||
|       transformedCoordinates = this.coordinates; | ||||
|     } else { | ||||
|       switch (this.host.componentType) { | ||||
|         case 'geometry-linestring': | ||||
|         case 'geometry-multipoint': | ||||
|           transformedCoordinates = (this.coordinates as Coordinate[]).map((c) => transform(c, this.srid, this.mapSrid)); | ||||
|           break; | ||||
|         case 'geometry-polygon': | ||||
|         case 'geometry-multilinestring': | ||||
|           transformedCoordinates = (this.coordinates as Coordinate[][]).map((cc) => | ||||
|             cc.map((c) => transform(c, this.srid, this.mapSrid)) | ||||
|           ); | ||||
|           break; | ||||
|         case 'geometry-multipolygon': | ||||
|           transformedCoordinates = (this.coordinates as Coordinate[][][]).map((ccc) => | ||||
|             ccc.map((cc) => cc.map((c) => transform(c, this.srid, this.mapSrid))) | ||||
|           ); | ||||
|           break; | ||||
|       } | ||||
|     } | ||||
|  | ||||
|     this.host.instance.setCoordinates(transformedCoordinates); | ||||
|   } | ||||
| } | ||||
| @@ -1,9 +0,0 @@ | ||||
| import { Component, ElementRef } from '@angular/core'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-content', | ||||
|   template: '<ng-content></ng-content>', | ||||
| }) | ||||
| export class ContentComponent { | ||||
|   constructor(public elementRef: ElementRef) {} | ||||
| } | ||||
| @@ -1,33 +0,0 @@ | ||||
| import { Component, ElementRef, Input, OnDestroy, OnInit } from '@angular/core'; | ||||
| import { Attribution } from 'ol/control'; | ||||
| import { MapComponent } from '../map.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-control-attribution', | ||||
|   template: ``, | ||||
| }) | ||||
| export class ControlAttributionComponent implements OnInit, OnDestroy { | ||||
|   @Input() | ||||
|   collapsible: boolean; | ||||
|  | ||||
|   public componentType = 'control'; | ||||
|   instance: Attribution; | ||||
|   target: HTMLElement; | ||||
|  | ||||
|   constructor( | ||||
|     private map: MapComponent, | ||||
|     private element: ElementRef | ||||
|   ) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.target = this.element.nativeElement; | ||||
|     // console.log('ol.control.Attribution init: ', this); | ||||
|     this.instance = new Attribution(this); | ||||
|     this.map.instance.addControl(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     // console.log('removing aol-control-attribution'); | ||||
|     this.map.instance.removeControl(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,33 +0,0 @@ | ||||
| import { Component, ContentChild, OnDestroy, OnInit } from '@angular/core'; | ||||
| import { Control } from 'ol/control'; | ||||
| import { MapComponent } from '../map.component'; | ||||
| import { ContentComponent } from '../content.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-control', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
| }) | ||||
| export class ControlComponent implements OnInit, OnDestroy { | ||||
|   @ContentChild(ContentComponent, { static: true }) | ||||
|   content: ContentComponent; | ||||
|  | ||||
|   public componentType = 'control'; | ||||
|   instance: Control; | ||||
|   element: HTMLElement; | ||||
|  | ||||
|   constructor(private map: MapComponent) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     if (this.content) { | ||||
|       this.element = this.content.elementRef.nativeElement; | ||||
|       this.instance = new Control(this); | ||||
|       this.map.instance.addControl(this.instance); | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     if (this.instance) { | ||||
|       this.map.instance.removeControl(this.instance); | ||||
|     } | ||||
|   } | ||||
| } | ||||
| @@ -1,42 +0,0 @@ | ||||
| import { Component, OnDestroy, OnInit, Input } from '@angular/core'; | ||||
| import { Control, defaults } from 'ol/control'; | ||||
| import { Collection } from 'ol'; | ||||
| import { Options as AttributionOptions } from 'ol/control/Attribution'; | ||||
| import { Options as RotateOptions } from 'ol/control/Rotate'; | ||||
| import { Options as ZoomOptions } from 'ol/control/Zoom'; | ||||
|  | ||||
| import { MapComponent } from '../map.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-control-defaults', | ||||
|   template: '', | ||||
| }) | ||||
| export class DefaultControlComponent implements OnInit, OnDestroy { | ||||
|   @Input() | ||||
|   attribution: boolean; | ||||
|   @Input() | ||||
|   attributionOptions: AttributionOptions; | ||||
|   @Input() | ||||
|   rotate: boolean; | ||||
|   @Input() | ||||
|   rotateOptions: RotateOptions; | ||||
|   @Input() | ||||
|   zoom: boolean; | ||||
|   @Input() | ||||
|   zoomOptions: ZoomOptions; | ||||
|  | ||||
|   instance: Collection<Control>; | ||||
|  | ||||
|   constructor(private map: MapComponent) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     // console.log('ol.control.defaults init: ', this); | ||||
|     this.instance = defaults(this); | ||||
|     this.instance.forEach((c) => this.map.instance.addControl(c)); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     // console.log('removing aol-control-defaults'); | ||||
|     this.instance.forEach((c) => this.map.instance.removeControl(c)); | ||||
|   } | ||||
| } | ||||
| @@ -1,36 +0,0 @@ | ||||
| import { Component, Input, OnDestroy, OnInit } from '@angular/core'; | ||||
| import { FullScreen } from 'ol/control'; | ||||
| import { MapComponent } from '../map.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-control-fullscreen', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
| }) | ||||
| export class ControlFullScreenComponent implements OnInit, OnDestroy { | ||||
|   @Input() | ||||
|   className: string; | ||||
|   @Input() | ||||
|   label: string; | ||||
|   @Input() | ||||
|   labelActive: string; | ||||
|   @Input() | ||||
|   tipLabel: string; | ||||
|   @Input() | ||||
|   keys: boolean; | ||||
|  | ||||
|   instance: FullScreen; | ||||
|  | ||||
|   constructor(private map: MapComponent) { | ||||
|     // console.log('instancing aol-control-fullscreen'); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new FullScreen(this); | ||||
|     this.map.instance.addControl(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     // console.log('removing aol-control-fullscreen'); | ||||
|     this.map.instance.removeControl(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,36 +0,0 @@ | ||||
| import { Component, ElementRef, Input, OnDestroy, OnInit } from '@angular/core'; | ||||
| import MousePosition from 'ol/control/MousePosition'; | ||||
| import { MapComponent } from '../map.component'; | ||||
| import { CoordinateFormat } from 'ol/coordinate'; | ||||
| import { ProjectionLike } from 'ol/proj'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-control-mouseposition', | ||||
|   template: ``, | ||||
| }) | ||||
| export class ControlMousePositionComponent implements OnInit, OnDestroy { | ||||
|   @Input() | ||||
|   coordinateFormat: CoordinateFormat; | ||||
|   @Input() | ||||
|   projection: ProjectionLike; | ||||
|  | ||||
|   instance: MousePosition; | ||||
|   target: HTMLElement; | ||||
|  | ||||
|   constructor( | ||||
|     private map: MapComponent, | ||||
|     private element: ElementRef | ||||
|   ) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.target = this.element.nativeElement; | ||||
|     // console.log('ol.control.MousePosition init: ', this); | ||||
|     this.instance = new MousePosition(this); | ||||
|     this.map.instance.addControl(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     // console.log('removing aol-control-mouseposition'); | ||||
|     this.map.instance.removeControl(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,53 +0,0 @@ | ||||
| import { Component, Input, OnDestroy, OnInit, OnChanges, SimpleChanges } from '@angular/core'; | ||||
| import { Layer } from 'ol/layer'; | ||||
| import { View } from 'ol'; | ||||
| import { OverviewMap } from 'ol/control'; | ||||
| import { MapComponent } from '../map.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-control-overviewmap', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
| }) | ||||
| export class ControlOverviewMapComponent implements OnInit, OnChanges, OnDestroy { | ||||
|   @Input() | ||||
|   collapsed: boolean; | ||||
|   @Input() | ||||
|   collapseLabel: string; | ||||
|   @Input() | ||||
|   collapsible: boolean; | ||||
|   @Input() | ||||
|   label: string; | ||||
|   @Input() | ||||
|   layers: Layer[]; | ||||
|   @Input() | ||||
|   target: HTMLElement; | ||||
|   @Input() | ||||
|   tipLabel: string; | ||||
|   @Input() | ||||
|   view: View; | ||||
|  | ||||
|   instance: OverviewMap; | ||||
|  | ||||
|   constructor(private map: MapComponent) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new OverviewMap(this); | ||||
|     this.map.instance.addControl(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     this.map.instance.removeControl(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnChanges(changes: SimpleChanges) { | ||||
|     if (this.instance != null && changes.hasOwnProperty('view')) { | ||||
|       this.reloadInstance(); | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   private reloadInstance() { | ||||
|     this.map.instance.removeControl(this.instance); | ||||
|     this.instance = new OverviewMap(this); | ||||
|     this.map.instance.addControl(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,36 +0,0 @@ | ||||
| import { Component, Input, OnDestroy, OnInit } from '@angular/core'; | ||||
| import { Rotate } from 'ol/control'; | ||||
| import { MapComponent } from '../map.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-control-rotate', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
| }) | ||||
| export class ControlRotateComponent implements OnInit, OnDestroy { | ||||
|   @Input() | ||||
|   className: string; | ||||
|   @Input() | ||||
|   label: string; | ||||
|   @Input() | ||||
|   tipLabel: string; | ||||
|   @Input() | ||||
|   duration: number; | ||||
|   @Input() | ||||
|   autoHide: boolean; | ||||
|  | ||||
|   instance: Rotate; | ||||
|  | ||||
|   constructor(private map: MapComponent) { | ||||
|     // console.log('instancing aol-control-rotate'); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new Rotate(this); | ||||
|     this.map.instance.addControl(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     // console.log('removing aol-control-rotate'); | ||||
|     this.map.instance.removeControl(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,26 +0,0 @@ | ||||
| import { Component, Input, OnDestroy, OnInit } from '@angular/core'; | ||||
| import { ScaleLine } from 'ol/control'; | ||||
| import { MapComponent } from '../map.component'; | ||||
| import { Units } from 'ol/control/ScaleLine'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-control-scaleline', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
| }) | ||||
| export class ControlScaleLineComponent implements OnInit, OnDestroy { | ||||
|   @Input() | ||||
|   units: Units; | ||||
|  | ||||
|   instance: ScaleLine; | ||||
|  | ||||
|   constructor(private map: MapComponent) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new ScaleLine(this); | ||||
|     this.map.instance.addControl(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     this.map.instance.removeControl(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,38 +0,0 @@ | ||||
| import { Component, Input, OnDestroy, OnInit } from '@angular/core'; | ||||
| import { Zoom } from 'ol/control'; | ||||
| import { MapComponent } from '../map.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-control-zoom', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
| }) | ||||
| export class ControlZoomComponent implements OnInit, OnDestroy { | ||||
|   @Input() | ||||
|   duration: number; | ||||
|   @Input() | ||||
|   zoomInLabel: string | HTMLElement; | ||||
|   @Input() | ||||
|   zoomOutLabel: string | HTMLElement; | ||||
|   @Input() | ||||
|   zoomInTipLabel: string; | ||||
|   @Input() | ||||
|   zoomOutTipLabel: string; | ||||
|   @Input() | ||||
|   delta: number; | ||||
|  | ||||
|   instance: Zoom; | ||||
|  | ||||
|   constructor(private map: MapComponent) { | ||||
|     // console.log('instancing aol-control-zoom'); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new Zoom(this); | ||||
|     this.map.instance.addControl(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     // console.log('removing aol-control-zoom'); | ||||
|     this.map.instance.removeControl(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,34 +0,0 @@ | ||||
| import { Component, Input, OnDestroy, OnInit } from '@angular/core'; | ||||
| import { ZoomSlider } from 'ol/control'; | ||||
| import { MapComponent } from '../map.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-control-zoomslider', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
| }) | ||||
| export class ControlZoomSliderComponent implements OnInit, OnDestroy { | ||||
|   @Input() | ||||
|   className: string; | ||||
|   @Input() | ||||
|   duration: number; | ||||
|   @Input() | ||||
|   maxResolution: number; | ||||
|   @Input() | ||||
|   minResolution: number; | ||||
|  | ||||
|   instance: ZoomSlider; | ||||
|  | ||||
|   constructor(private map: MapComponent) { | ||||
|     // console.log('instancing aol-control-zoomslider'); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new ZoomSlider(this); | ||||
|     this.map.instance.addControl(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     // console.log('removing aol-control-zoomslider'); | ||||
|     this.map.instance.removeControl(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,35 +0,0 @@ | ||||
| import { Component, Input, OnDestroy, OnInit } from '@angular/core'; | ||||
| import { ZoomToExtent } from 'ol/control'; | ||||
| import { MapComponent } from '../map.component'; | ||||
| import { Extent } from 'ol/extent'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-control-zoomtoextent', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
| }) | ||||
| export class ControlZoomToExtentComponent implements OnInit, OnDestroy { | ||||
|   @Input() | ||||
|   className: string; | ||||
|   @Input() | ||||
|   label: string | HTMLElement; | ||||
|   @Input() | ||||
|   tipLabel: string; | ||||
|   @Input() | ||||
|   extent: Extent; | ||||
|  | ||||
|   instance: ZoomToExtent; | ||||
|  | ||||
|   constructor(private map: MapComponent) { | ||||
|     // console.log('instancing aol-control-zoomtoextent'); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new ZoomToExtent(this); | ||||
|     this.map.instance.addControl(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     // console.log('removing aol-control-zoomtoextent'); | ||||
|     this.map.instance.removeControl(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,80 +0,0 @@ | ||||
| import { Component, Optional, OnChanges, Input, SimpleChanges, OnInit } from '@angular/core'; | ||||
| import { transform } from 'ol/proj'; | ||||
| import { MapComponent } from './map.component'; | ||||
| import { GeometryPointComponent } from './geom/geometrypoint.component'; | ||||
| import { GeometryCircleComponent } from './geom/geometrycircle.component'; | ||||
| import { ViewComponent } from './view.component'; | ||||
| import { OverlayComponent } from './overlay.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-coordinate', | ||||
|   template: ` <div class="aol-coordinate"></div> `, | ||||
| }) | ||||
| export class CoordinateComponent implements OnChanges, OnInit { | ||||
|   @Input() | ||||
|   x: number; | ||||
|   @Input() | ||||
|   y: number; | ||||
|   @Input() | ||||
|   srid = 'EPSG:3857'; | ||||
|  | ||||
|   private host: any; | ||||
|   private mapSrid = 'EPSG:3857'; | ||||
|  | ||||
|   constructor( | ||||
|     private map: MapComponent, | ||||
|     @Optional() viewHost: ViewComponent, | ||||
|     @Optional() geometryPointHost: GeometryPointComponent, | ||||
|     @Optional() geometryCircleHost: GeometryCircleComponent, | ||||
|     @Optional() overlayHost: OverlayComponent | ||||
|   ) { | ||||
|     // console.log('instancing aol-coordinate'); | ||||
|     if (geometryPointHost !== null) { | ||||
|       this.host = geometryPointHost; | ||||
|     } else if (geometryCircleHost !== null) { | ||||
|       this.host = geometryCircleHost; | ||||
|     } else if (viewHost !== null) { | ||||
|       this.host = viewHost; | ||||
|     } else if (overlayHost !== null) { | ||||
|       this.host = overlayHost; | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.map.instance.on('change:view', (e) => this.onMapViewChanged(e)); | ||||
|     this.mapSrid = this.map.instance.getView().getProjection().getCode(); | ||||
|     this.transformCoordinates(); | ||||
|   } | ||||
|  | ||||
|   ngOnChanges(changes: SimpleChanges) { | ||||
|     this.transformCoordinates(); | ||||
|   } | ||||
|  | ||||
|   private onMapViewChanged(event) { | ||||
|     this.mapSrid = event.target.get(event.key).getProjection().getCode(); | ||||
|     this.transformCoordinates(); | ||||
|   } | ||||
|  | ||||
|   private transformCoordinates() { | ||||
|     let transformedCoordinates: number[]; | ||||
|  | ||||
|     if (this.srid === this.mapSrid) { | ||||
|       transformedCoordinates = [this.x, this.y]; | ||||
|     } else { | ||||
|       transformedCoordinates = transform([this.x, this.y], this.srid, this.mapSrid); | ||||
|     } | ||||
|  | ||||
|     switch (this.host.componentType) { | ||||
|       case 'geometry-point': | ||||
|         this.host.instance.setCoordinates(transformedCoordinates); | ||||
|         break; | ||||
|       case 'geometry-circle': | ||||
|       case 'view': | ||||
|         this.host.instance.setCenter(transformedCoordinates); | ||||
|         break; | ||||
|       case 'overlay': | ||||
|         this.host.instance.setPosition(transformedCoordinates); | ||||
|         break; | ||||
|     } | ||||
|   } | ||||
| } | ||||
| @@ -1,35 +0,0 @@ | ||||
| import { Component, OnInit, OnDestroy, OnChanges, Input, SimpleChanges } from '@angular/core'; | ||||
| import { Feature } from 'ol'; | ||||
| import { SourceVectorComponent } from './sources/vector.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-feature', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
| }) | ||||
| export class FeatureComponent implements OnInit, OnDestroy, OnChanges { | ||||
|   @Input() | ||||
|   id: string | number | undefined; | ||||
|  | ||||
|   public componentType = 'feature'; | ||||
|   public instance: Feature; | ||||
|  | ||||
|   constructor(private host: SourceVectorComponent) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new Feature(); | ||||
|     if (this.id !== undefined) { | ||||
|       this.instance.setId(this.id); | ||||
|     } | ||||
|     this.host.instance.addFeature(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     this.host.instance.removeFeature(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnChanges(changes: SimpleChanges) { | ||||
|     if (this.instance) { | ||||
|       this.instance.setId(this.id); | ||||
|     } | ||||
|   } | ||||
| } | ||||
| @@ -1,6 +0,0 @@ | ||||
| import Feature from 'ol/format/Feature'; | ||||
|  | ||||
| export class FormatComponent { | ||||
|   public instance: Feature; | ||||
|   public componentType = 'format'; | ||||
| } | ||||
| @@ -1,27 +0,0 @@ | ||||
| import { Component, forwardRef, Input } from '@angular/core'; | ||||
| import { FormatComponent } from './format.component'; | ||||
| import { MVT } from 'ol/format'; | ||||
| import { FeatureClass } from 'ol/Feature'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-format-mvt', | ||||
|   template: '', | ||||
|   providers: [{ provide: FormatComponent, useExisting: forwardRef(() => FormatMVTComponent) }], | ||||
| }) | ||||
| export class FormatMVTComponent extends FormatComponent { | ||||
|   @Input() | ||||
|   featureClass: FeatureClass; | ||||
|   @Input() | ||||
|   geometryName: string; | ||||
|   @Input() | ||||
|   layerName: string; | ||||
|   @Input() | ||||
|   layers: string[]; | ||||
|  | ||||
|   instance: MVT; | ||||
|  | ||||
|   constructor() { | ||||
|     super(); | ||||
|     this.instance = new MVT(this); | ||||
|   } | ||||
| } | ||||
| @@ -1,28 +0,0 @@ | ||||
| import { Component, Input, OnInit } from '@angular/core'; | ||||
| import { FeatureComponent } from '../feature.component'; | ||||
| import { Circle } from 'ol/geom'; | ||||
| import { SimpleGeometryComponent } from './simplegeometry.component'; | ||||
| import { MapComponent } from '../map.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-geometry-circle', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
| }) | ||||
| export class GeometryCircleComponent extends SimpleGeometryComponent implements OnInit { | ||||
|   @Input() | ||||
|   get radius(): number { | ||||
|     return this.instance.getRadius(); | ||||
|   } | ||||
|   set radius(radius: number) { | ||||
|     this.instance.setRadius(radius); | ||||
|   } | ||||
|  | ||||
|   public componentType = 'geometry-circle'; | ||||
|   public instance: Circle; | ||||
|  | ||||
|   constructor(map: MapComponent, host: FeatureComponent) { | ||||
|     super(map, host); | ||||
|     // defaulting coordinates to [0,0]. To be overridden in child component. | ||||
|     this.instance = new Circle([0, 0]); | ||||
|   } | ||||
| } | ||||
| @@ -1,26 +0,0 @@ | ||||
| import { Component, OnInit } from '@angular/core'; | ||||
| import { FeatureComponent } from '../feature.component'; | ||||
| import { SimpleGeometryComponent } from './simplegeometry.component'; | ||||
| import { MapComponent } from '../map.component'; | ||||
| import { LineString } from 'ol/geom'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-geometry-linestring', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
| }) | ||||
| export class GeometryLinestringComponent extends SimpleGeometryComponent implements OnInit { | ||||
|   public componentType = 'geometry-linestring'; | ||||
|   public instance: LineString; | ||||
|  | ||||
|   constructor(map: MapComponent, host: FeatureComponent) { | ||||
|     super(map, host); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new LineString([ | ||||
|       [0, 0], | ||||
|       [1, 1], | ||||
|     ]); | ||||
|     super.ngOnInit(); | ||||
|   } | ||||
| } | ||||
| @@ -1,28 +0,0 @@ | ||||
| import { Component, OnInit } from '@angular/core'; | ||||
| import { FeatureComponent } from '../feature.component'; | ||||
| import { SimpleGeometryComponent } from './simplegeometry.component'; | ||||
| import { MapComponent } from '../map.component'; | ||||
| import { MultiLineString } from 'ol/geom'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-geometry-multilinestring', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
| }) | ||||
| export class GeometryMultiLinestringComponent extends SimpleGeometryComponent implements OnInit { | ||||
|   public componentType = 'geometry-multilinestring'; | ||||
|   public instance: MultiLineString; | ||||
|  | ||||
|   constructor(map: MapComponent, host: FeatureComponent) { | ||||
|     super(map, host); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new MultiLineString([ | ||||
|       [ | ||||
|         [0, 0], | ||||
|         [1, 1], | ||||
|       ], | ||||
|     ]); | ||||
|     super.ngOnInit(); | ||||
|   } | ||||
| } | ||||
| @@ -1,26 +0,0 @@ | ||||
| import { Component, OnInit } from '@angular/core'; | ||||
| import { FeatureComponent } from '../feature.component'; | ||||
| import { SimpleGeometryComponent } from './simplegeometry.component'; | ||||
| import { MapComponent } from '../map.component'; | ||||
| import { MultiPoint } from 'ol/geom'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-geometry-multipoint', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
| }) | ||||
| export class GeometryMultiPointComponent extends SimpleGeometryComponent implements OnInit { | ||||
|   public componentType = 'geometry-multipoint'; | ||||
|   public instance: MultiPoint; | ||||
|  | ||||
|   constructor(map: MapComponent, host: FeatureComponent) { | ||||
|     super(map, host); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new MultiPoint([ | ||||
|       [0, 0], | ||||
|       [1, 1], | ||||
|     ]); | ||||
|     super.ngOnInit(); | ||||
|   } | ||||
| } | ||||
| @@ -1,31 +0,0 @@ | ||||
| import { Component, OnInit } from '@angular/core'; | ||||
| import { FeatureComponent } from '../feature.component'; | ||||
| import { SimpleGeometryComponent } from './simplegeometry.component'; | ||||
| import { MapComponent } from '../map.component'; | ||||
| import { MultiPolygon } from 'ol/geom'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-geometry-multipolygon', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
| }) | ||||
| export class GeometryMultiPolygonComponent extends SimpleGeometryComponent implements OnInit { | ||||
|   public componentType = 'geometry-multipolygon'; | ||||
|   public instance: MultiPolygon; | ||||
|  | ||||
|   constructor(map: MapComponent, host: FeatureComponent) { | ||||
|     super(map, host); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new MultiPolygon([ | ||||
|       [ | ||||
|         [ | ||||
|           [0, 0], | ||||
|           [1, 1], | ||||
|           [0, 1], | ||||
|         ], | ||||
|       ], | ||||
|     ]); | ||||
|     super.ngOnInit(); | ||||
|   } | ||||
| } | ||||
| @@ -1,23 +0,0 @@ | ||||
| import { Component, OnInit } from '@angular/core'; | ||||
| import { FeatureComponent } from '../feature.component'; | ||||
| import { SimpleGeometryComponent } from './simplegeometry.component'; | ||||
| import { MapComponent } from '../map.component'; | ||||
| import { Point } from 'ol/geom'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-geometry-point', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
| }) | ||||
| export class GeometryPointComponent extends SimpleGeometryComponent implements OnInit { | ||||
|   public componentType = 'geometry-point'; | ||||
|   public instance: Point; | ||||
|  | ||||
|   constructor(map: MapComponent, host: FeatureComponent) { | ||||
|     super(map, host); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new Point([0, 0]); | ||||
|     super.ngOnInit(); | ||||
|   } | ||||
| } | ||||
| @@ -1,29 +0,0 @@ | ||||
| import { Component, OnInit } from '@angular/core'; | ||||
| import { FeatureComponent } from '../feature.component'; | ||||
| import { SimpleGeometryComponent } from './simplegeometry.component'; | ||||
| import { MapComponent } from '../map.component'; | ||||
| import { Polygon } from 'ol/geom'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-geometry-polygon', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
| }) | ||||
| export class GeometryPolygonComponent extends SimpleGeometryComponent implements OnInit { | ||||
|   public componentType = 'geometry-polygon'; | ||||
|   public instance: Polygon; | ||||
|  | ||||
|   constructor(map: MapComponent, host: FeatureComponent) { | ||||
|     super(map, host); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new Polygon([ | ||||
|       [ | ||||
|         [0, 0], | ||||
|         [1, 1], | ||||
|         [0, 1], | ||||
|       ], | ||||
|     ]); | ||||
|     super.ngOnInit(); | ||||
|   } | ||||
| } | ||||
| @@ -1,22 +0,0 @@ | ||||
| import { Input, OnInit, Directive } from '@angular/core'; | ||||
| import { FeatureComponent } from '../feature.component'; | ||||
| import { MapComponent } from '../map.component'; | ||||
| import SimpleGeometry from 'ol/geom/SimpleGeometry'; | ||||
|  | ||||
| @Directive() | ||||
| // eslint-disable-next-line @angular-eslint/directive-class-suffix | ||||
| export abstract class SimpleGeometryComponent implements OnInit { | ||||
|   @Input() srid: string; | ||||
|  | ||||
|   public instance: SimpleGeometry; | ||||
|   public componentType = 'simple-geometry'; | ||||
|  | ||||
|   protected constructor( | ||||
|     protected map: MapComponent, | ||||
|     protected host: FeatureComponent | ||||
|   ) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.host.instance.setGeometry(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,57 +0,0 @@ | ||||
| import { Component, Input, AfterContentInit, OnChanges, SimpleChanges, OnDestroy } from '@angular/core'; | ||||
| import { Graticule } from 'ol'; | ||||
| import { Stroke } from 'ol/style'; | ||||
| import { MapComponent } from './map.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-graticule', | ||||
|   template: '<ng-content></ng-content>', | ||||
| }) | ||||
| export class GraticuleComponent implements AfterContentInit, OnChanges, OnDestroy { | ||||
|   @Input() | ||||
|   strokeStyle: Stroke; | ||||
|   @Input() | ||||
|   showLabels: boolean; | ||||
|   @Input() | ||||
|   lonLabelPosition: number; | ||||
|   @Input() | ||||
|   latLabelPosition: number; | ||||
|  | ||||
|   instance: any; | ||||
|   public componentType = 'graticule'; | ||||
|  | ||||
|   constructor(private map: MapComponent) {} | ||||
|  | ||||
|   ngOnChanges(changes: SimpleChanges) { | ||||
|     const properties: { [index: string]: any } = {}; | ||||
|  | ||||
|     if (!this.instance) { | ||||
|       return; | ||||
|     } | ||||
|  | ||||
|     for (const key in changes) { | ||||
|       if (changes.hasOwnProperty(key)) { | ||||
|         properties[key] = changes[key].currentValue; | ||||
|       } | ||||
|     } | ||||
|  | ||||
|     if (properties) { | ||||
|       this.instance = new Graticule(properties); | ||||
|     } | ||||
|     this.instance.setMap(this.map.instance); | ||||
|   } | ||||
|  | ||||
|   ngAfterContentInit(): void { | ||||
|     this.instance = new Graticule({ | ||||
|       strokeStyle: this.strokeStyle, | ||||
|       showLabels: this.showLabels, | ||||
|       lonLabelPosition: this.lonLabelPosition, | ||||
|       latLabelPosition: this.latLabelPosition, | ||||
|     }); | ||||
|     this.instance.setMap(this.map.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy(): void { | ||||
|     this.instance.setMap(null); | ||||
|   } | ||||
| } | ||||
| @@ -1,46 +0,0 @@ | ||||
| import { Component, Input, OnDestroy, OnInit } from '@angular/core'; | ||||
| import { defaults, Interaction } from 'ol/interaction'; | ||||
| import { Collection } from 'ol'; | ||||
| import { MapComponent } from '../map.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-interaction-default', | ||||
|   template: '', | ||||
| }) | ||||
| export class DefaultInteractionComponent implements OnInit, OnDestroy { | ||||
|   @Input() | ||||
|   altShiftDragRotate: boolean; | ||||
|   @Input() | ||||
|   onFocusOnly: boolean; | ||||
|   @Input() | ||||
|   doubleClickZoom: boolean; | ||||
|   @Input() | ||||
|   keyboard: boolean; | ||||
|   @Input() | ||||
|   mouseWheelZoom: boolean; | ||||
|   @Input() | ||||
|   shiftDragZoom: boolean; | ||||
|   @Input() | ||||
|   dragPan: boolean; | ||||
|   @Input() | ||||
|   pinchRotate: boolean; | ||||
|   @Input() | ||||
|   pinchZoom: boolean; | ||||
|   @Input() | ||||
|   zoomDelta: number; | ||||
|   @Input() | ||||
|   zoomDuration: number; | ||||
|  | ||||
|   instance: Collection<Interaction>; | ||||
|  | ||||
|   constructor(private map: MapComponent) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = defaults(this); | ||||
|     this.instance.forEach((i) => this.map.instance.addInteraction(i)); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     this.instance.forEach((i) => this.map.instance.removeInteraction(i)); | ||||
|   } | ||||
| } | ||||
| @@ -1,27 +0,0 @@ | ||||
| import { Component, Input, OnDestroy, OnInit } from '@angular/core'; | ||||
| import { DoubleClickZoom } from 'ol/interaction'; | ||||
| import { MapComponent } from '../map.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-interaction-doubleclickzoom', | ||||
|   template: '', | ||||
| }) | ||||
| export class DoubleClickZoomInteractionComponent implements OnInit, OnDestroy { | ||||
|   @Input() | ||||
|   duration: number; | ||||
|   @Input() | ||||
|   delta: number; | ||||
|  | ||||
|   instance: DoubleClickZoom; | ||||
|  | ||||
|   constructor(private map: MapComponent) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new DoubleClickZoom(this); | ||||
|     this.map.instance.addInteraction(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     this.map.instance.removeInteraction(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,31 +0,0 @@ | ||||
| import { Component, Input, OnDestroy, OnInit } from '@angular/core'; | ||||
| import { DragAndDrop } from 'ol/interaction'; | ||||
| import FeatureFormat from 'ol/format/Feature'; | ||||
| import { MapComponent } from '../map.component'; | ||||
| import { ProjectionLike } from 'ol/proj'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-interaction-draganddrop', | ||||
|   template: '', | ||||
| }) | ||||
| export class DragAndDropInteractionComponent implements OnInit, OnDestroy { | ||||
|   @Input() | ||||
|   formatConstructors: FeatureFormat[]; | ||||
|   @Input() | ||||
|   projection: ProjectionLike; | ||||
|   @Input() | ||||
|   target: HTMLElement; | ||||
|  | ||||
|   instance: DragAndDrop; | ||||
|  | ||||
|   constructor(private map: MapComponent) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new DragAndDrop(this); | ||||
|     this.map.instance.addInteraction(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     this.map.instance.removeInteraction(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,31 +0,0 @@ | ||||
| import { Component, OnDestroy, OnInit, Input } from '@angular/core'; | ||||
| import { DragBox } from 'ol/interaction'; | ||||
| import { MapComponent } from '../map.component'; | ||||
| import { Condition } from 'ol/events/condition'; | ||||
| import { EndCondition } from 'ol/interaction/DragBox'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-interaction-dragbox', | ||||
|   template: '', | ||||
| }) | ||||
| export class DragBoxInteractionComponent implements OnInit, OnDestroy { | ||||
|   @Input() | ||||
|   className: string; | ||||
|   @Input() | ||||
|   condition: Condition; | ||||
|   @Input() | ||||
|   boxEndCondition: EndCondition; | ||||
|  | ||||
|   instance: DragBox; | ||||
|  | ||||
|   constructor(private map: MapComponent) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new DragBox(this); | ||||
|     this.map.instance.addInteraction(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     this.map.instance.removeInteraction(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,29 +0,0 @@ | ||||
| import { Component, OnDestroy, OnInit, Input } from '@angular/core'; | ||||
| import { DragPan } from 'ol/interaction'; | ||||
| import Kinetic from 'ol/Kinetic'; | ||||
| import { MapComponent } from '../map.component'; | ||||
| import { Condition } from 'ol/events/condition'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-interaction-dragpan', | ||||
|   template: '', | ||||
| }) | ||||
| export class DragPanInteractionComponent implements OnInit, OnDestroy { | ||||
|   @Input() | ||||
|   condition: Condition; | ||||
|   @Input() | ||||
|   kinetic: Kinetic; | ||||
|  | ||||
|   instance: DragPan; | ||||
|  | ||||
|   constructor(private map: MapComponent) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new DragPan(this); | ||||
|     this.map.instance.addInteraction(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     this.map.instance.removeInteraction(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,28 +0,0 @@ | ||||
| import { Component, OnDestroy, OnInit, Input } from '@angular/core'; | ||||
| import { DragRotate } from 'ol/interaction'; | ||||
| import { MapComponent } from '../map.component'; | ||||
| import { Condition } from 'ol/events/condition'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-interaction-dragrotate', | ||||
|   template: '', | ||||
| }) | ||||
| export class DragRotateInteractionComponent implements OnInit, OnDestroy { | ||||
|   @Input() | ||||
|   condition: Condition; | ||||
|   @Input() | ||||
|   duration: number; | ||||
|  | ||||
|   instance: DragRotate; | ||||
|  | ||||
|   constructor(private map: MapComponent) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new DragRotate(this); | ||||
|     this.map.instance.addInteraction(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     this.map.instance.removeInteraction(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,28 +0,0 @@ | ||||
| import { Component, OnDestroy, OnInit, Input } from '@angular/core'; | ||||
| import { DragRotateAndZoom } from 'ol/interaction'; | ||||
| import { MapComponent } from '../map.component'; | ||||
| import { Condition } from 'ol/events/condition'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-interaction-dragrotateandzoom', | ||||
|   template: '', | ||||
| }) | ||||
| export class DragRotateAndZoomInteractionComponent implements OnInit, OnDestroy { | ||||
|   @Input() | ||||
|   condition: Condition; | ||||
|   @Input() | ||||
|   duration: number; | ||||
|  | ||||
|   instance: DragRotateAndZoom; | ||||
|  | ||||
|   constructor(private map: MapComponent) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new DragRotateAndZoom(this); | ||||
|     this.map.instance.addInteraction(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     this.map.instance.removeInteraction(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,32 +0,0 @@ | ||||
| import { Component, OnDestroy, OnInit, Input } from '@angular/core'; | ||||
| import { DragZoom } from 'ol/interaction'; | ||||
| import { MapComponent } from '../map.component'; | ||||
| import { Condition } from 'ol/events/condition'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-interaction-dragzoom', | ||||
|   template: '', | ||||
| }) | ||||
| export class DragZoomInteractionComponent implements OnInit, OnDestroy { | ||||
|   @Input() | ||||
|   className: string; | ||||
|   @Input() | ||||
|   condition: Condition; | ||||
|   @Input() | ||||
|   duration: number; | ||||
|   @Input() | ||||
|   out: boolean; | ||||
|  | ||||
|   instance: DragZoom; | ||||
|  | ||||
|   constructor(private map: MapComponent) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new DragZoom(this); | ||||
|     this.map.instance.addInteraction(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     this.map.instance.removeInteraction(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,84 +0,0 @@ | ||||
| import { Component, Input, OnDestroy, OnInit, EventEmitter, Output } from '@angular/core'; | ||||
| import { MapComponent } from '../map.component'; | ||||
| import { Draw } from 'ol/interaction'; | ||||
| import { Collection, Feature } from 'ol'; | ||||
| import { Vector } from 'ol/source'; | ||||
| import { Style } from 'ol/style'; | ||||
| import { DrawEvent, GeometryFunction } from 'ol/interaction/Draw'; | ||||
| import { StyleFunction } from 'ol/style/Style'; | ||||
| import { Condition } from 'ol/events/condition'; | ||||
| import { Type } from 'ol/geom/Geometry'; | ||||
| import { ObjectEvent } from 'ol/Object'; | ||||
| import BaseEvent from 'ol/events/Event'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-interaction-draw', | ||||
|   template: '', | ||||
| }) | ||||
| export class DrawInteractionComponent implements OnInit, OnDestroy { | ||||
|   @Input() | ||||
|   clickTolerance?: number; | ||||
|   @Input() | ||||
|   features?: Collection<Feature>; | ||||
|   @Input() | ||||
|   source?: Vector; | ||||
|   @Input() | ||||
|   snapTolerance?: number; | ||||
|   @Input() | ||||
|   type: Type; | ||||
|   @Input() | ||||
|   maxPoints?: number; | ||||
|   @Input() | ||||
|   minPoints?: number; | ||||
|   @Input() | ||||
|   finishCondition?: Condition; | ||||
|   @Input() | ||||
|   style?: Style | Style[] | StyleFunction; | ||||
|   @Input() | ||||
|   geometryFunction?: GeometryFunction; | ||||
|   @Input() | ||||
|   geometryName?: string; | ||||
|   @Input() | ||||
|   condition?: Condition; | ||||
|   @Input() | ||||
|   freehandCondition?: Condition; | ||||
|   @Input() | ||||
|   freehand?: boolean; | ||||
|   @Input() | ||||
|   wrapX?: boolean; | ||||
|  | ||||
|   @Output() | ||||
|   olChange = new EventEmitter<DrawEvent>(); | ||||
|   @Output() | ||||
|   olChangeActive = new EventEmitter<ObjectEvent>(); | ||||
|   @Output() | ||||
|   olDrawAbort = new EventEmitter<DrawEvent>(); | ||||
|   @Output() | ||||
|   drawEnd = new EventEmitter<DrawEvent>(); | ||||
|   @Output() | ||||
|   drawStart = new EventEmitter<DrawEvent>(); | ||||
|   @Output() | ||||
|   olError = new EventEmitter<BaseEvent>(); | ||||
|   @Output() | ||||
|   propertyChange = new EventEmitter<ObjectEvent>(); | ||||
|  | ||||
|   instance: Draw; | ||||
|  | ||||
|   constructor(private map: MapComponent) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new Draw(this); | ||||
|     this.instance.on('change', (event: DrawEvent) => this.olChange.emit(event)); | ||||
|     this.instance.on('change:active', (event: ObjectEvent) => this.olChangeActive.emit(event)); | ||||
|     this.instance.on('drawabort', (event: DrawEvent) => this.olDrawAbort.emit(event)); | ||||
|     this.instance.on('drawend', (event: DrawEvent) => this.drawEnd.emit(event)); | ||||
|     this.instance.on('drawstart', (event: DrawEvent) => this.drawStart.emit(event)); | ||||
|     this.instance.on('error', (event: BaseEvent) => this.olError.emit(event)); | ||||
|     this.instance.on('propertychange', (event: ObjectEvent) => this.propertyChange.emit(event)); | ||||
|     this.map.instance.addInteraction(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     this.map.instance.removeInteraction(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,27 +0,0 @@ | ||||
| import { Component, Input, OnDestroy, OnInit } from '@angular/core'; | ||||
| import { KeyboardPan } from 'ol/interaction'; | ||||
| import { MapComponent } from '../map.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-interaction-keyboardpan', | ||||
|   template: '', | ||||
| }) | ||||
| export class KeyboardPanInteractionComponent implements OnInit, OnDestroy { | ||||
|   @Input() | ||||
|   duration: number; | ||||
|   @Input() | ||||
|   pixelDelta: number; | ||||
|  | ||||
|   instance: KeyboardPan; | ||||
|  | ||||
|   constructor(private map: MapComponent) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new KeyboardPan(this); | ||||
|     this.map.instance.addInteraction(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     this.map.instance.removeInteraction(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,27 +0,0 @@ | ||||
| import { Component, Input, OnDestroy, OnInit } from '@angular/core'; | ||||
| import { KeyboardZoom } from 'ol/interaction'; | ||||
| import { MapComponent } from '../map.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-interaction-keyboardpan', | ||||
|   template: '', | ||||
| }) | ||||
| export class KeyboardZoomInteractionComponent implements OnInit, OnDestroy { | ||||
|   @Input() | ||||
|   duration: number; | ||||
|   @Input() | ||||
|   delta: number; | ||||
|  | ||||
|   instance: KeyboardZoom; | ||||
|  | ||||
|   constructor(private map: MapComponent) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new KeyboardZoom(this); | ||||
|     this.map.instance.addInteraction(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     this.map.instance.removeInteraction(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,65 +0,0 @@ | ||||
| import { Component, OnDestroy, OnInit, Input, Output, EventEmitter } from '@angular/core'; | ||||
| import { MapComponent } from '../map.component'; | ||||
| import { Modify } from 'ol/interaction'; | ||||
| import { Collection, Feature } from 'ol'; | ||||
| import { Style } from 'ol/style'; | ||||
| import { Vector } from 'ol/source'; | ||||
| import { ModifyEvent } from 'ol/interaction/Modify'; | ||||
| import { StyleFunction } from 'ol/style/Style'; | ||||
| import { Condition } from 'ol/events/condition'; | ||||
| import { ObjectEvent } from 'ol/Object'; | ||||
| import { DrawEvent } from 'ol/interaction/Draw'; | ||||
| import BaseEvent from 'ol/events/Event'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-interaction-modify', | ||||
|   template: '', | ||||
| }) | ||||
| export class ModifyInteractionComponent implements OnInit, OnDestroy { | ||||
|   @Input() | ||||
|   condition?: Condition; | ||||
|   @Input() | ||||
|   deleteCondition?: Condition; | ||||
|   @Input() | ||||
|   pixelTolerance?: number; | ||||
|   @Input() | ||||
|   style?: Style | Style[] | StyleFunction; | ||||
|   @Input() | ||||
|   features: Collection<Feature>; | ||||
|   @Input() | ||||
|   wrapX?: boolean; | ||||
|   @Input() | ||||
|   source?: Vector; | ||||
|  | ||||
|   @Output() | ||||
|   olChange = new EventEmitter<DrawEvent>(); | ||||
|   @Output() | ||||
|   olChangeActive = new EventEmitter<ObjectEvent>(); | ||||
|   @Output() | ||||
|   olError = new EventEmitter<BaseEvent>(); | ||||
|   @Output() | ||||
|   olModifyEnd = new EventEmitter<ModifyEvent>(); | ||||
|   @Output() | ||||
|   olModifyStart = new EventEmitter<ModifyEvent>(); | ||||
|   @Output() | ||||
|   propertyChange = new EventEmitter<ObjectEvent>(); | ||||
|  | ||||
|   instance: Modify; | ||||
|  | ||||
|   constructor(private map: MapComponent) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new Modify(this); | ||||
|     this.instance.on('change', (event: DrawEvent) => this.olChange.emit(event)); | ||||
|     this.instance.on('change:active', (event: ObjectEvent) => this.olChangeActive.emit(event)); | ||||
|     this.instance.on('error', (event: BaseEvent) => this.olError.emit(event)); | ||||
|     this.instance.on('modifyend', (event: ModifyEvent) => this.olModifyEnd.emit(event)); | ||||
|     this.instance.on('modifystart', (event: ModifyEvent) => this.olModifyStart.emit(event)); | ||||
|     this.instance.on('propertychange', (event: ObjectEvent) => this.propertyChange.emit(event)); | ||||
|     this.map.instance.addInteraction(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     this.map.instance.removeInteraction(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,29 +0,0 @@ | ||||
| import { Component, Input, OnDestroy, OnInit } from '@angular/core'; | ||||
| import { MouseWheelZoom } from 'ol/interaction'; | ||||
| import { MapComponent } from '../map.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-interaction-mousewheelzoom', | ||||
|   template: '', | ||||
| }) | ||||
| export class MouseWheelZoomInteractionComponent implements OnInit, OnDestroy { | ||||
|   @Input() | ||||
|   duration: number; | ||||
|   @Input() | ||||
|   timeout: number; | ||||
|   @Input() | ||||
|   useAnchor: boolean; | ||||
|  | ||||
|   instance: MouseWheelZoom; | ||||
|  | ||||
|   constructor(private map: MapComponent) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new MouseWheelZoom(this); | ||||
|     this.map.instance.addInteraction(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     this.map.instance.removeInteraction(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,27 +0,0 @@ | ||||
| import { Component, OnDestroy, OnInit, Input } from '@angular/core'; | ||||
| import { PinchZoom } from 'ol/interaction'; | ||||
| import { MapComponent } from '../map.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-interaction-pinchzoom', | ||||
|   template: '', | ||||
| }) | ||||
| export class PinchZoomInteractionComponent implements OnInit, OnDestroy { | ||||
|   @Input() | ||||
|   duration: number; | ||||
|   @Input() | ||||
|   constrainResolution: boolean; | ||||
|  | ||||
|   instance: PinchZoom; | ||||
|  | ||||
|   constructor(private map: MapComponent) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new PinchZoom(this); | ||||
|     this.map.instance.addInteraction(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     this.map.instance.removeInteraction(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,68 +0,0 @@ | ||||
| import { Component, OnDestroy, OnInit, Input, Output, EventEmitter } from '@angular/core'; | ||||
| import { MapComponent } from '../map.component'; | ||||
| import { Select } from 'ol/interaction'; | ||||
| import { Layer } from 'ol/layer'; | ||||
| import { Style } from 'ol/style'; | ||||
| import { Collection, Feature } from 'ol'; | ||||
| import { SelectEvent, FilterFunction } from 'ol/interaction/Select'; | ||||
| import { StyleFunction } from 'ol/style/Style'; | ||||
| import { Condition } from 'ol/events/condition'; | ||||
| import { ObjectEvent } from 'ol/Object'; | ||||
| import BaseEvent from 'ol/events/Event'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-interaction-select', | ||||
|   template: '', | ||||
| }) | ||||
| export class SelectInteractionComponent implements OnInit, OnDestroy { | ||||
|   @Input() | ||||
|   addCondition?: Condition; | ||||
|   @Input() | ||||
|   condition?: Condition; | ||||
|   @Input() | ||||
|   layers?: Layer[] | ((layer: Layer) => boolean); | ||||
|   @Input() | ||||
|   style?: Style | Style[] | StyleFunction; | ||||
|   @Input() | ||||
|   removeCondition?: Condition; | ||||
|   @Input() | ||||
|   toggleCondition?: Condition; | ||||
|   @Input() | ||||
|   multi?: boolean; | ||||
|   @Input() | ||||
|   features?: Collection<Feature>; | ||||
|   @Input() | ||||
|   filter?: FilterFunction; | ||||
|   @Input() | ||||
|   wrapX?: boolean; | ||||
|  | ||||
|   @Output() | ||||
|   olChange = new EventEmitter<SelectEvent>(); | ||||
|   @Output() | ||||
|   olChangeActive = new EventEmitter<ObjectEvent>(); | ||||
|   @Output() | ||||
|   olError = new EventEmitter<BaseEvent>(); | ||||
|   @Output() | ||||
|   propertyChange = new EventEmitter<ObjectEvent>(); | ||||
|   @Output() | ||||
|   olSelect = new EventEmitter<SelectEvent>(); | ||||
|  | ||||
|   instance: Select; | ||||
|  | ||||
|   constructor(private map: MapComponent) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new Select(this); | ||||
|  | ||||
|     this.instance.on('change', (event: SelectEvent) => this.olChange.emit(event)); | ||||
|     this.instance.on('change:active', (event: ObjectEvent) => this.olChangeActive.emit(event)); | ||||
|     this.instance.on('error', (event: BaseEvent) => this.olError.emit(event)); | ||||
|     this.instance.on('propertychange', (event: ObjectEvent) => this.propertyChange.emit(event)); | ||||
|     this.instance.on('select', (event: SelectEvent) => this.olSelect.emit(event)); | ||||
|     this.map.instance.addInteraction(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     this.map.instance.removeInteraction(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,58 +0,0 @@ | ||||
| import { Component, OnDestroy, OnInit, Input, Output, EventEmitter } from '@angular/core'; | ||||
| 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'; | ||||
| import BaseEvent from 'ol/events/Event'; | ||||
| import { ObjectEvent } from 'ol/Object'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-interaction-translate', | ||||
|   template: '', | ||||
| }) | ||||
| export class TranslateInteractionComponent implements OnInit, OnDestroy { | ||||
|   @Input() | ||||
|   features?: Collection<Feature>; | ||||
|   @Input() | ||||
|   layers?: Layer[] | ((layer: Layer) => boolean); | ||||
|   @Input() | ||||
|   hitTolerance?: number; | ||||
|  | ||||
|   @Output() | ||||
|   olChange = new EventEmitter<BaseEvent>(); | ||||
|   @Output() | ||||
|   olChangeActive = new EventEmitter<ObjectEvent>(); | ||||
|   @Output() | ||||
|   olError = new EventEmitter<BaseEvent>(); | ||||
|   @Output() | ||||
|   propertyChange = new EventEmitter<ObjectEvent>(); | ||||
|   @Output() | ||||
|   translateEnd = new EventEmitter<TranslateEvent>(); | ||||
|   @Output() | ||||
|   translateStart = new EventEmitter<TranslateEvent>(); | ||||
|   @Output() | ||||
|   translating = new EventEmitter<TranslateEvent>(); | ||||
|  | ||||
|   instance: Translate; | ||||
|  | ||||
|   constructor(private map: MapComponent) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new Translate(this); | ||||
|  | ||||
|     this.instance.on('change', (event: BaseEvent) => this.olChange.emit(event)); | ||||
|     this.instance.on('change:active', (event: ObjectEvent) => this.olChangeActive.emit(event)); | ||||
|     this.instance.on('error', (event: BaseEvent) => this.olError.emit(event)); | ||||
|     this.instance.on('propertychange', (event: ObjectEvent) => this.propertyChange.emit(event)); | ||||
|     this.instance.on('translateend', (event: TranslateEvent) => this.translateEnd.emit(event)); | ||||
|     this.instance.on('translatestart', (event: TranslateEvent) => this.translateStart.emit(event)); | ||||
|     this.instance.on('translating', (event: TranslateEvent) => this.translating.emit(event)); | ||||
|  | ||||
|     this.map.instance.addInteraction(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     this.map.instance.removeInteraction(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,68 +0,0 @@ | ||||
| import { OnDestroy, OnInit, OnChanges, Input, SimpleChanges, Directive } from '@angular/core'; | ||||
| import Event from 'ol/events/Event'; | ||||
| import { MapComponent } from '../map.component'; | ||||
| import { LayerGroupComponent } from './layergroup.component'; | ||||
| import { Extent } from 'ol/extent'; | ||||
|  | ||||
| @Directive() | ||||
| // eslint-disable-next-line @angular-eslint/directive-class-suffix | ||||
| export abstract class LayerComponent implements OnInit, OnChanges, OnDestroy { | ||||
|   @Input() | ||||
|   opacity: number; | ||||
|   @Input() | ||||
|   visible: boolean; | ||||
|   @Input() | ||||
|   extent: Extent; | ||||
|   @Input() | ||||
|   zIndex: number; | ||||
|   @Input() | ||||
|   minResolution: number; | ||||
|   @Input() | ||||
|   maxResolution: number; | ||||
|  | ||||
|   @Input() | ||||
|   prerender: (evt: Event) => void; | ||||
|   @Input() | ||||
|   postrender: (evt: Event) => void; | ||||
|  | ||||
|   public instance: any; | ||||
|   public componentType = 'layer'; | ||||
|  | ||||
|   protected constructor(protected host: MapComponent | LayerGroupComponent) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     if (this.prerender !== null && this.prerender !== undefined) { | ||||
|       this.instance.on('prerender', this.prerender); | ||||
|     } | ||||
|     if (this.postrender !== null && this.postrender !== undefined) { | ||||
|       this.instance.on('postrender', this.postrender); | ||||
|     } | ||||
|     this.host.instance.getLayers().push(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     this.host.instance.getLayers().remove(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnChanges(changes: SimpleChanges) { | ||||
|     const properties: { [index: string]: any } = {}; | ||||
|     if (!this.instance) { | ||||
|       return; | ||||
|     } | ||||
|     for (const key in changes) { | ||||
|       if (changes.hasOwnProperty(key)) { | ||||
|         properties[key] = changes[key].currentValue; | ||||
|         if (key === 'prerender') { | ||||
|           this.instance.un('prerender', changes[key].previousValue); | ||||
|           this.instance.on('prerender', changes[key].currentValue); | ||||
|         } | ||||
|         if (key === 'postrender') { | ||||
|           this.instance.un('postrender', changes[key].previousValue); | ||||
|           this.instance.on('postrender', changes[key].currentValue); | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|     // console.log('changes detected in aol-layer, setting new properties: ', properties); | ||||
|     this.instance.setProperties(properties, false); | ||||
|   } | ||||
| } | ||||
| @@ -1,27 +0,0 @@ | ||||
| import { Component, OnDestroy, OnInit, SkipSelf, Optional } from '@angular/core'; | ||||
| import { Group } from 'ol/layer'; | ||||
| import { LayerComponent } from './layer.component'; | ||||
| import { MapComponent } from '../map.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-layer-group', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
| }) | ||||
| export class LayerGroupComponent extends LayerComponent implements OnInit, OnDestroy { | ||||
|   public instance: Group; | ||||
|  | ||||
|   constructor( | ||||
|     map: MapComponent, | ||||
|     @SkipSelf() | ||||
|     @Optional() | ||||
|     group?: LayerGroupComponent | ||||
|   ) { | ||||
|     super(group || map); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     // console.log(`creating ol.layer.Group instance with:`, this); | ||||
|     this.instance = new Group(this); | ||||
|     super.ngOnInit(); | ||||
|   } | ||||
| } | ||||
| @@ -1,38 +0,0 @@ | ||||
| import { Component, Input, OnChanges, OnInit, Optional, SimpleChanges } from '@angular/core'; | ||||
| import { Image } from 'ol/layer'; | ||||
| import { MapComponent } from '../map.component'; | ||||
| import { LayerComponent } from './layer.component'; | ||||
| import { LayerGroupComponent } from './layergroup.component'; | ||||
| import { Extent } from 'ol/extent'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-layer-image', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
| }) | ||||
| export class LayerImageComponent extends LayerComponent implements OnInit, OnChanges { | ||||
|   @Input() | ||||
|   opacity: number; | ||||
|   @Input() | ||||
|   visible: boolean; | ||||
|   @Input() | ||||
|   extent: Extent; | ||||
|   @Input() | ||||
|   minResolution: number; | ||||
|   @Input() | ||||
|   maxResolution: number; | ||||
|   @Input() | ||||
|   zIndex: number; | ||||
|  | ||||
|   constructor(map: MapComponent, @Optional() group?: LayerGroupComponent) { | ||||
|     super(group || map); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new Image(this); | ||||
|     super.ngOnInit(); | ||||
|   } | ||||
|  | ||||
|   ngOnChanges(changes: SimpleChanges) { | ||||
|     super.ngOnChanges(changes); | ||||
|   } | ||||
| } | ||||
| @@ -1,30 +0,0 @@ | ||||
| import { Component, OnDestroy, OnInit, Input, Optional, OnChanges, SimpleChanges } from '@angular/core'; | ||||
| import { Tile } from 'ol/layer'; | ||||
| import { MapComponent } from '../map.component'; | ||||
| import { LayerComponent } from './layer.component'; | ||||
| import { LayerGroupComponent } from './layergroup.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-layer-tile', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
| }) | ||||
| export class LayerTileComponent extends LayerComponent implements OnInit, OnDestroy, OnChanges { | ||||
|   @Input() | ||||
|   preload: number; | ||||
|   @Input() | ||||
|   useInterimTilesOnError: boolean; | ||||
|  | ||||
|   constructor(map: MapComponent, @Optional() group?: LayerGroupComponent) { | ||||
|     super(group || map); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     // console.log('creating ol.layer.Tile instance with:', this); | ||||
|     this.instance = new Tile(this); | ||||
|     super.ngOnInit(); | ||||
|   } | ||||
|  | ||||
|   ngOnChanges(changes: SimpleChanges) { | ||||
|     super.ngOnChanges(changes); | ||||
|   } | ||||
| } | ||||
| @@ -1,39 +0,0 @@ | ||||
| import { Component, OnDestroy, OnInit, Input, Optional, OnChanges, SimpleChanges } from '@angular/core'; | ||||
| import { MapComponent } from '../map.component'; | ||||
| import { Vector } from 'ol/layer'; | ||||
| import { Style } from 'ol/style'; | ||||
| import { StyleFunction } from 'ol/style/Style'; | ||||
| import { LayerComponent } from './layer.component'; | ||||
| import { LayerGroupComponent } from './layergroup.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-layer-vector', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
| }) | ||||
| export class LayerVectorComponent extends LayerComponent implements OnInit, OnDestroy, OnChanges { | ||||
|   @Input() | ||||
|   renderBuffer: number; | ||||
|  | ||||
|   @Input() | ||||
|   style: Style | Style[] | StyleFunction; | ||||
|  | ||||
|   @Input() | ||||
|   updateWhileAnimating: boolean; | ||||
|  | ||||
|   @Input() | ||||
|   updateWhileInteracting: boolean; | ||||
|  | ||||
|   constructor(map: MapComponent, @Optional() group?: LayerGroupComponent) { | ||||
|     super(group || map); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     // console.log('creating ol.layer.Vector instance with:', this); | ||||
|     this.instance = new Vector(this); | ||||
|     super.ngOnInit(); | ||||
|   } | ||||
|  | ||||
|   ngOnChanges(changes: SimpleChanges) { | ||||
|     super.ngOnChanges(changes); | ||||
|   } | ||||
| } | ||||
| @@ -1,44 +0,0 @@ | ||||
| import { Component, OnInit, Input, Optional, SimpleChanges, OnChanges } from '@angular/core'; | ||||
| import { VectorTile } from 'ol/layer'; | ||||
| 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/style/Style'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-layer-vectortile', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
| }) | ||||
| export class LayerVectorTileComponent extends LayerComponent implements OnInit, OnChanges { | ||||
|   @Input() | ||||
|   renderBuffer: number; | ||||
|   @Input() | ||||
|   renderMode: any | string; | ||||
|   /* not marked as optional in the typings */ | ||||
|   @Input() | ||||
|   renderOrder: (feature1: Feature, feature2: Feature) => number; | ||||
|   @Input() | ||||
|   style: Style | Style[] | StyleFunction; | ||||
|   @Input() | ||||
|   updateWhileAnimating: boolean; | ||||
|   @Input() | ||||
|   updateWhileInteracting: boolean; | ||||
|   @Input() | ||||
|   visible: boolean; | ||||
|  | ||||
|   constructor(map: MapComponent, @Optional() group?: LayerGroupComponent) { | ||||
|     super(group || map); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     // console.log('creating ol.layer.VectorTile instance with:', this); | ||||
|     this.instance = new VectorTile(this); | ||||
|     super.ngOnInit(); | ||||
|   } | ||||
|  | ||||
|   ngOnChanges(changes: SimpleChanges) { | ||||
|     super.ngOnChanges(changes); | ||||
|   } | ||||
| } | ||||
| @@ -1,142 +0,0 @@ | ||||
| import { | ||||
|   Component, | ||||
|   OnInit, | ||||
|   ElementRef, | ||||
|   Input, | ||||
|   Output, | ||||
|   EventEmitter, | ||||
|   AfterViewInit, | ||||
|   SimpleChanges, | ||||
|   OnChanges, | ||||
| } from '@angular/core'; | ||||
| import { Map } from 'ol'; | ||||
| 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'; | ||||
| import { DrawEvent } from 'ol/interaction/Draw'; | ||||
| import BaseEvent from 'ol/events/Event'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-map', | ||||
|   template: ` | ||||
|     <div [style.width]="width" [style.height]="height"></div> | ||||
|     <ng-content></ng-content> | ||||
|   `, | ||||
| }) | ||||
| export class MapComponent implements OnInit, AfterViewInit, OnChanges { | ||||
|   @Input() | ||||
|   width = '100%'; | ||||
|   @Input() | ||||
|   height = '100%'; | ||||
|   @Input() | ||||
|   pixelRatio: number; | ||||
|   @Input() | ||||
|   keyboardEventTarget: HTMLElement | string; | ||||
|   @Input() | ||||
|   loadTilesWhileAnimating: boolean; | ||||
|   @Input() | ||||
|   loadTilesWhileInteracting: boolean; | ||||
|   @Input() | ||||
|   logo: string | boolean; | ||||
|   @Input() | ||||
|   renderer: 'canvas' | 'webgl'; | ||||
|  | ||||
|   @Output() | ||||
|   olChange = new EventEmitter<DrawEvent>(); | ||||
|   @Output() | ||||
|   olChangeLayerGroup = new EventEmitter<ObjectEvent>(); | ||||
|   @Output() | ||||
|   olChangeSize = new EventEmitter<ObjectEvent>(); | ||||
|   @Output() | ||||
|   olChangeTarget = new EventEmitter<ObjectEvent>(); | ||||
|   @Output() | ||||
|   olChangeView = new EventEmitter<ObjectEvent>(); | ||||
|   @Output() | ||||
|   olClick = new EventEmitter<MapBrowserEvent<MouseEvent>>(); | ||||
|   @Output() | ||||
|   dblClick = new EventEmitter<MapBrowserEvent<MouseEvent>>(); | ||||
|   @Output() | ||||
|   olError = new EventEmitter<BaseEvent>(); | ||||
|   @Output() | ||||
|   loadEnd = new EventEmitter<MapEvent>(); | ||||
|   @Output() | ||||
|   loadStart = new EventEmitter<MapEvent>(); | ||||
|   @Output() | ||||
|   moveEnd = new EventEmitter<MapEvent>(); | ||||
|   @Output() | ||||
|   moveStart = new EventEmitter<MapEvent>(); | ||||
|   @Output() | ||||
|   pointerDrag = new EventEmitter<MapBrowserEvent<MouseEvent>>(); | ||||
|   @Output() | ||||
|   pointerMove = new EventEmitter<MapBrowserEvent<MouseEvent>>(); | ||||
|   @Output() | ||||
|   olPostCompose = new EventEmitter<RenderEvent>(); | ||||
|   @Output() | ||||
|   olPostRender = new EventEmitter<RenderEvent>(); | ||||
|   @Output() | ||||
|   olPreCompose = new EventEmitter<RenderEvent>(); | ||||
|   @Output() | ||||
|   olPropertyChange = new EventEmitter<ObjectEvent>(); | ||||
|   @Output() | ||||
|   postRender = new EventEmitter<MapEvent>(); | ||||
|   @Output() | ||||
|   propertyChange = new EventEmitter<ObjectEvent>(); | ||||
|   @Output() | ||||
|   singleClick = new EventEmitter<MapBrowserEvent<MouseEvent>>(); | ||||
|  | ||||
|   public instance: Map; | ||||
|   public componentType = 'map'; | ||||
|  | ||||
|   // we pass empty arrays to not get default controls/interactions because we have our own directives | ||||
|   controls: Control[] = []; | ||||
|   interactions: Interaction[] = []; | ||||
|  | ||||
|   constructor(private host: ElementRef) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     // console.log('creating ol.Map instance with:', this); | ||||
|     this.instance = new Map(this); | ||||
|     this.instance.setTarget(this.host.nativeElement.firstElementChild); | ||||
|     this.instance.on('change', (event: DrawEvent) => this.olChange.emit(event)); | ||||
|     this.instance.on('change:layergroup', (event: ObjectEvent) => this.olChangeLayerGroup.emit(event)); | ||||
|     this.instance.on('change:size', (event: ObjectEvent) => this.olChangeSize.emit(event)); | ||||
|     this.instance.on('change:target', (event: ObjectEvent) => this.olChangeTarget.emit(event)); | ||||
|     this.instance.on('change:view', (event: ObjectEvent) => this.olChangeView.emit(event)); | ||||
|     this.instance.on('click', (event: MapBrowserEvent<MouseEvent>) => this.olClick.emit(event)); | ||||
|     this.instance.on('dblclick', (event: MapBrowserEvent<MouseEvent>) => this.dblClick.emit(event)); | ||||
|     this.instance.on('error', (event: BaseEvent) => this.olError.emit(event)); | ||||
|     this.instance.on('loadend', (event: MapEvent) => this.loadEnd.emit(event)); | ||||
|     this.instance.on('loadstart', (event: MapEvent) => this.loadStart.emit(event)); | ||||
|     this.instance.on('moveend', (event: MapEvent) => this.moveEnd.emit(event)); | ||||
|     this.instance.on('movestart', (event: MapEvent) => this.moveStart.emit(event)); | ||||
|     this.instance.on('pointerdrag', (event: MapBrowserEvent<MouseEvent>) => this.pointerDrag.emit(event)); | ||||
|     this.instance.on('pointermove', (event: MapBrowserEvent<MouseEvent>) => this.pointerMove.emit(event)); | ||||
|     this.instance.on('postcompose', (event: RenderEvent) => this.olPostCompose.emit(event)); | ||||
|     this.instance.on('postrender', (event: RenderEvent) => this.olPostRender.emit(event)); | ||||
|     this.instance.on('postrender', (event: MapEvent) => this.postRender.emit(event)); | ||||
|     this.instance.on('precompose', (event: RenderEvent) => this.olPreCompose.emit(event)); | ||||
|     this.instance.on('propertychange', (event: ObjectEvent) => this.olPropertyChange.emit(event)); | ||||
|     this.instance.on('singleclick', (event: MapBrowserEvent<MouseEvent>) => this.singleClick.emit(event)); | ||||
|   } | ||||
|  | ||||
|   ngOnChanges(changes: SimpleChanges) { | ||||
|     const properties: { [index: string]: any } = {}; | ||||
|     if (!this.instance) { | ||||
|       return; | ||||
|     } | ||||
|     for (const key in changes) { | ||||
|       if (changes.hasOwnProperty(key)) { | ||||
|         properties[key] = changes[key].currentValue; | ||||
|       } | ||||
|     } | ||||
|     // console.log('changes detected in aol-map, setting new properties: ', properties); | ||||
|     this.instance.setProperties(properties, false); | ||||
|   } | ||||
|  | ||||
|   ngAfterViewInit() { | ||||
|     this.instance.updateSize(); | ||||
|   } | ||||
| } | ||||
| @@ -1,50 +0,0 @@ | ||||
| import { Component, ContentChild, Input, OnDestroy, OnInit } from '@angular/core'; | ||||
| import { MapComponent } from './map.component'; | ||||
| import Overlay, { PanOptions, Positioning } from 'ol/Overlay'; | ||||
| import { ContentComponent } from './content.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-overlay', | ||||
|   template: '<ng-content></ng-content>', | ||||
| }) | ||||
| export class OverlayComponent implements OnInit, OnDestroy { | ||||
|   @ContentChild(ContentComponent, { static: true }) | ||||
|   content: ContentComponent; | ||||
|  | ||||
|   @Input() | ||||
|   id: number | string; | ||||
|   @Input() | ||||
|   offset: number[]; | ||||
|   @Input() | ||||
|   positioning: Positioning; | ||||
|   @Input() | ||||
|   stopEvent: boolean; | ||||
|   @Input() | ||||
|   insertFirst: boolean; | ||||
|   @Input() | ||||
|   autoPan: boolean; | ||||
|   @Input() | ||||
|   autoPanAnimation: PanOptions; | ||||
|   @Input() | ||||
|   autoPanMargin: number; | ||||
|  | ||||
|   componentType = 'overlay'; | ||||
|   instance: Overlay; | ||||
|   element: HTMLElement; | ||||
|  | ||||
|   constructor(private map: MapComponent) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     if (this.content) { | ||||
|       this.element = this.content.elementRef.nativeElement; | ||||
|       this.instance = new Overlay(this); | ||||
|       this.map.instance.addOverlay(this.instance); | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     if (this.instance) { | ||||
|       this.map.instance.removeOverlay(this.instance); | ||||
|     } | ||||
|   } | ||||
| } | ||||
| @@ -1,42 +0,0 @@ | ||||
| import { Component, Host, Input, OnInit, forwardRef } from '@angular/core'; | ||||
| import { BingMaps } from 'ol/source'; | ||||
| import { SourceComponent } from './source.component'; | ||||
| import { LayerTileComponent } from '../layers/layertile.component'; | ||||
| import { LoadFunction } from 'ol/Tile'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-source-bingmaps', | ||||
|   template: ` <div class="aol-source-bingmaps"></div> `, | ||||
|   providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceBingmapsComponent) }], | ||||
| }) | ||||
| export class SourceBingmapsComponent extends SourceComponent implements OnInit { | ||||
|   @Input() | ||||
|   cacheSize: number; | ||||
|   @Input() | ||||
|   hidpi: boolean; | ||||
|   @Input() | ||||
|   culture: string; | ||||
|   @Input() | ||||
|   key: string; | ||||
|   @Input() | ||||
|   imagerySet: 'Road' | 'Aerial' | 'AerialWithLabels' | 'collinsBart' | 'ordnanceSurvey' = 'Aerial'; | ||||
|   @Input() | ||||
|   maxZoom: number; | ||||
|   @Input() | ||||
|   reprojectionErrorThreshold: number; | ||||
|   @Input() | ||||
|   tileLoadFunction: LoadFunction; | ||||
|   @Input() | ||||
|   wrapX: boolean; | ||||
|  | ||||
|   instance: BingMaps; | ||||
|  | ||||
|   constructor(@Host() layer: LayerTileComponent) { | ||||
|     super(layer); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new BingMaps(this); | ||||
|     this.host.instance.setSource(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,54 +0,0 @@ | ||||
| import { | ||||
|   AfterContentInit, | ||||
|   Component, | ||||
|   ContentChild, | ||||
|   forwardRef, | ||||
|   Host, | ||||
|   Input, | ||||
|   OnChanges, | ||||
|   SimpleChanges, | ||||
| } from '@angular/core'; | ||||
| import { Feature } from 'ol'; | ||||
| import { Point } from 'ol/geom'; | ||||
| import { Cluster, Vector } from 'ol/source'; | ||||
|  | ||||
| import { LayerVectorComponent } from '../layers/layervector.component'; | ||||
| import { SourceComponent } from './source.component'; | ||||
| import { SourceVectorComponent } from './vector.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-source-cluster', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
|   providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceClusterComponent) }], | ||||
| }) | ||||
| export class SourceClusterComponent extends SourceComponent implements AfterContentInit, OnChanges { | ||||
|   @Input() | ||||
|   distance: number; | ||||
|   @Input() | ||||
|   geometryFunction?: (feature: Feature) => Point; | ||||
|   @Input() | ||||
|   wrapX?: boolean; | ||||
|  | ||||
|   @ContentChild(SourceVectorComponent, { static: false }) | ||||
|   sourceVectorComponent: SourceVectorComponent; | ||||
|  | ||||
|   instance: Cluster; | ||||
|   source: Vector; | ||||
|  | ||||
|   constructor(@Host() layer: LayerVectorComponent) { | ||||
|     super(layer); | ||||
|   } | ||||
|  | ||||
|   ngAfterContentInit() { | ||||
|     this.source = this.sourceVectorComponent.instance; | ||||
|  | ||||
|     this.instance = new Cluster(this); | ||||
|     this.host.instance.setSource(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnChanges(changes: SimpleChanges) { | ||||
|     if (this.instance && changes.hasOwnProperty('distance')) { | ||||
|       this.instance.setDistance(this.distance); | ||||
|     } | ||||
|   } | ||||
| } | ||||
| @@ -1,36 +0,0 @@ | ||||
| import { Component, Host, Input, OnInit, forwardRef } from '@angular/core'; | ||||
| import { LayerVectorComponent } from '../layers/layervector.component'; | ||||
| import { SourceComponent } from './source.component'; | ||||
| import FeatureFormat from 'ol/format/Feature'; | ||||
| import { Vector } from 'ol/source'; | ||||
| import { GeoJSON } from 'ol/format'; | ||||
| import { ProjectionLike } from 'ol/proj'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-source-geojson', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
|   providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceGeoJSONComponent) }], | ||||
| }) | ||||
| export class SourceGeoJSONComponent extends SourceComponent implements OnInit { | ||||
|   @Input() | ||||
|   defaultDataProjection: ProjectionLike; | ||||
|   @Input() | ||||
|   featureProjection: ProjectionLike; | ||||
|   @Input() | ||||
|   geometryName: string; | ||||
|   @Input() | ||||
|   url: string; | ||||
|  | ||||
|   instance: Vector; | ||||
|   format: FeatureFormat; | ||||
|  | ||||
|   constructor(@Host() layer: LayerVectorComponent) { | ||||
|     super(layer); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.format = new GeoJSON(this); | ||||
|     this.instance = new Vector(this); | ||||
|     this.host.instance.setSource(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,62 +0,0 @@ | ||||
| import { | ||||
|   Component, | ||||
|   EventEmitter, | ||||
|   forwardRef, | ||||
|   Host, | ||||
|   Input, | ||||
|   OnChanges, | ||||
|   OnInit, | ||||
|   Output, | ||||
|   SimpleChanges, | ||||
| } from '@angular/core'; | ||||
| import ImageArcGISRest from 'ol/source/ImageArcGISRest'; | ||||
| import { LayerImageComponent } from '../layers/layerimage.component'; | ||||
| import { SourceComponent } from './source.component'; | ||||
| import { ProjectionLike } from 'ol/proj'; | ||||
| import { AttributionLike } from 'ol/source/Source'; | ||||
| import { LoadFunction } from 'ol/Image'; | ||||
| import { ImageSourceEvent } from 'ol/source/Image'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-source-imagearcgisrest', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
|   providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceImageArcGISRestComponent) }], | ||||
| }) | ||||
| export class SourceImageArcGISRestComponent extends SourceComponent implements OnInit, OnChanges { | ||||
|   @Input() projection: ProjectionLike | string; | ||||
|   @Input() url: string; | ||||
|   @Input() attributions: AttributionLike; | ||||
|   @Input() crossOrigin?: string; | ||||
|   @Input() imageLoadFunction?: LoadFunction; | ||||
|   @Input() params?: { [k: string]: any }; | ||||
|   @Input() ratio = 1.5; | ||||
|   @Input() resolutions?: number[]; | ||||
|   @Input() wrapX?: boolean; | ||||
|  | ||||
|   @Output() | ||||
|   imageLoadStart = new EventEmitter<ImageSourceEvent>(); | ||||
|   @Output() | ||||
|   imageLoadEnd = new EventEmitter<ImageSourceEvent>(); | ||||
|   @Output() | ||||
|   imageLoadError = new EventEmitter<ImageSourceEvent>(); | ||||
|  | ||||
|   instance: ImageArcGISRest; | ||||
|  | ||||
|   constructor(@Host() layer: LayerImageComponent) { | ||||
|     super(layer); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new ImageArcGISRest(this); | ||||
|     this.host.instance.setSource(this.instance); | ||||
|     this.instance.on('imageloadstart', (event: ImageSourceEvent) => this.imageLoadStart.emit(event)); | ||||
|     this.instance.on('imageloadend', (event: ImageSourceEvent) => this.imageLoadEnd.emit(event)); | ||||
|     this.instance.on('imageloaderror', (event: ImageSourceEvent) => this.imageLoadError.emit(event)); | ||||
|   } | ||||
|  | ||||
|   ngOnChanges(changes: SimpleChanges) { | ||||
|     if (this.instance && changes.hasOwnProperty('params')) { | ||||
|       this.instance.updateParams(this.params); | ||||
|     } | ||||
|   } | ||||
| } | ||||
| @@ -1,88 +0,0 @@ | ||||
| import { | ||||
|   Component, | ||||
|   Host, | ||||
|   Input, | ||||
|   forwardRef, | ||||
|   Output, | ||||
|   EventEmitter, | ||||
|   OnChanges, | ||||
|   SimpleChanges, | ||||
|   OnInit, | ||||
| } from '@angular/core'; | ||||
| import { ImageStatic } from 'ol/source'; | ||||
| import { SourceComponent } from './source.component'; | ||||
| import { LayerImageComponent } from '../layers/layerimage.component'; | ||||
| import { ProjectionLike } from 'ol/proj'; | ||||
| import { Extent } from 'ol/extent'; | ||||
| import { AttributionLike } from 'ol/source/Source'; | ||||
| import { LoadFunction } from 'ol/Image'; | ||||
| import { Size } from 'ol/size'; | ||||
| import { ImageSourceEvent } from 'ol/source/Image'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-source-imagestatic', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
|   providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceImageStaticComponent) }], | ||||
| }) | ||||
| export class SourceImageStaticComponent extends SourceComponent implements OnInit, OnChanges { | ||||
|   @Input() | ||||
|   projection: ProjectionLike | string; | ||||
|   @Input() | ||||
|   imageExtent: Extent; | ||||
|   @Input() | ||||
|   url: string; | ||||
|   @Input() | ||||
|   attributions: AttributionLike; | ||||
|   @Input() | ||||
|   crossOrigin?: string; | ||||
|   @Input() | ||||
|   imageLoadFunction?: LoadFunction; | ||||
|   @Input() | ||||
|   imageSize?: Size; | ||||
|  | ||||
|   @Output() | ||||
|   imageLoadStart = new EventEmitter<ImageSourceEvent>(); | ||||
|   @Output() | ||||
|   imageLoadEnd = new EventEmitter<ImageSourceEvent>(); | ||||
|   @Output() | ||||
|   imageLoadError = new EventEmitter<ImageSourceEvent>(); | ||||
|  | ||||
|   instance: ImageStatic; | ||||
|  | ||||
|   constructor(@Host() layer: LayerImageComponent) { | ||||
|     super(layer); | ||||
|   } | ||||
|  | ||||
|   setLayerSource(): void { | ||||
|     this.instance = new ImageStatic(this); | ||||
|     this.host.instance.setSource(this.instance); | ||||
|     this.instance.on('imageloadstart', (event: ImageSourceEvent) => this.imageLoadStart.emit(event)); | ||||
|     this.instance.on('imageloadend', (event: ImageSourceEvent) => this.imageLoadEnd.emit(event)); | ||||
|     this.instance.on('imageloaderror', (event: ImageSourceEvent) => this.imageLoadError.emit(event)); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.setLayerSource(); | ||||
|   } | ||||
|  | ||||
|   ngOnChanges(changes: SimpleChanges) { | ||||
|     const properties: { [index: string]: any } = {}; | ||||
|     if (!this.instance) { | ||||
|       return; | ||||
|     } | ||||
|     for (const key in changes) { | ||||
|       if (changes.hasOwnProperty(key)) { | ||||
|         switch (key) { | ||||
|           case 'url': | ||||
|             this.url = changes[key].currentValue; | ||||
|             this.setLayerSource(); | ||||
|             break; | ||||
|           default: | ||||
|             break; | ||||
|         } | ||||
|         properties[key] = changes[key].currentValue; | ||||
|       } | ||||
|     } | ||||
|     this.instance.setProperties(properties, false); | ||||
|   } | ||||
| } | ||||
| @@ -1,74 +0,0 @@ | ||||
| import { | ||||
|   Component, | ||||
|   Host, | ||||
|   Input, | ||||
|   OnChanges, | ||||
|   OnInit, | ||||
|   forwardRef, | ||||
|   SimpleChanges, | ||||
|   Output, | ||||
|   EventEmitter, | ||||
| } from '@angular/core'; | ||||
| import { ImageWMS } from 'ol/source'; | ||||
| import { LayerImageComponent } from '../layers/layerimage.component'; | ||||
| import { SourceComponent } from './source.component'; | ||||
| import { ProjectionLike } from 'ol/proj'; | ||||
| import { AttributionLike } from 'ol/source/Source'; | ||||
| import { LoadFunction } from 'ol/Image'; | ||||
| import { ImageSourceEvent } from 'ol/source/Image'; | ||||
| import { ServerType } from 'ol/source/wms'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-source-imagewms', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
|   providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceImageWMSComponent) }], | ||||
| }) | ||||
| export class SourceImageWMSComponent extends SourceComponent implements OnChanges, OnInit { | ||||
|   @Input() | ||||
|   attributions: AttributionLike; | ||||
|   @Input() | ||||
|   crossOrigin: string; | ||||
|   @Input() | ||||
|   hidpi: boolean; | ||||
|   @Input() | ||||
|   serverType: ServerType; | ||||
|   @Input() | ||||
|   imageLoadFunction?: LoadFunction; | ||||
|   @Input() | ||||
|   params: { [key: string]: any }; | ||||
|   @Input() | ||||
|   projection: ProjectionLike | string; | ||||
|   @Input() | ||||
|   ratio: number; | ||||
|   @Input() | ||||
|   resolutions: Array<number>; | ||||
|   @Input() | ||||
|   url: string; | ||||
|  | ||||
|   @Output() | ||||
|   imageLoadStart = new EventEmitter<ImageSourceEvent>(); | ||||
|   @Output() | ||||
|   imageLoadEnd = new EventEmitter<ImageSourceEvent>(); | ||||
|   @Output() | ||||
|   imageLoadError = new EventEmitter<ImageSourceEvent>(); | ||||
|  | ||||
|   instance: ImageWMS; | ||||
|  | ||||
|   constructor(@Host() layer: LayerImageComponent) { | ||||
|     super(layer); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new ImageWMS(this); | ||||
|     this.host.instance.setSource(this.instance); | ||||
|     this.instance.on('imageloadstart', (event: ImageSourceEvent) => this.imageLoadStart.emit(event)); | ||||
|     this.instance.on('imageloadend', (event: ImageSourceEvent) => this.imageLoadEnd.emit(event)); | ||||
|     this.instance.on('imageloaderror', (event: ImageSourceEvent) => this.imageLoadError.emit(event)); | ||||
|   } | ||||
|  | ||||
|   ngOnChanges(changes: SimpleChanges) { | ||||
|     if (this.instance && changes.hasOwnProperty('params')) { | ||||
|       this.instance.updateParams(this.params); | ||||
|     } | ||||
|   } | ||||
| } | ||||
| @@ -1,62 +0,0 @@ | ||||
| import { AfterContentInit, Component, EventEmitter, forwardRef, Host, Input, Optional, Output } from '@angular/core'; | ||||
| import { OSM } from 'ol/source'; | ||||
| import { AttributionLike } from 'ol/source/Source'; | ||||
| import { TileSourceEvent } from 'ol/source/Tile'; | ||||
| import { LoadFunction } from 'ol/Tile'; | ||||
| import { LayerTileComponent } from '../layers/layertile.component'; | ||||
| import { SourceComponent } from './source.component'; | ||||
| import { SourceXYZComponent } from './xyz.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-source-osm', | ||||
|   template: ` <div class="aol-source-osm"></div> `, | ||||
|   providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceOsmComponent) }], | ||||
| }) | ||||
| export class SourceOsmComponent extends SourceXYZComponent implements AfterContentInit { | ||||
|   @Input() | ||||
|   attributions: AttributionLike; | ||||
|   @Input() | ||||
|   cacheSize: number; | ||||
|   @Input() | ||||
|   crossOrigin: string; | ||||
|   @Input() | ||||
|   maxZoom: number; | ||||
|   @Input() | ||||
|   opaque: boolean; | ||||
|   @Input() | ||||
|   reprojectionErrorThreshold: number; | ||||
|   @Input() | ||||
|   tileLoadFunction: LoadFunction; | ||||
|   @Input() | ||||
|   url: string; | ||||
|   @Input() | ||||
|   wrapX: boolean; | ||||
|  | ||||
|   @Output() | ||||
|   tileLoadStart = new EventEmitter<TileSourceEvent>(); | ||||
|   @Output() | ||||
|   tileLoadEnd = new EventEmitter<TileSourceEvent>(); | ||||
|   @Output() | ||||
|   tileLoadError = new EventEmitter<TileSourceEvent>(); | ||||
|  | ||||
|   instance: OSM; | ||||
|  | ||||
|   constructor( | ||||
|     @Optional() | ||||
|     @Host() | ||||
|     protected layer?: LayerTileComponent | ||||
|   ) { | ||||
|     super(layer); | ||||
|   } | ||||
|  | ||||
|   ngAfterContentInit() { | ||||
|     if (this.tileGridXYZ) { | ||||
|       this.tileGrid = this.tileGridXYZ.instance; | ||||
|     } | ||||
|     this.instance = new OSM(this); | ||||
|     this.instance.on('tileloadstart', (event: TileSourceEvent) => this.tileLoadStart.emit(event)); | ||||
|     this.instance.on('tileloadend', (event: TileSourceEvent) => this.tileLoadEnd.emit(event)); | ||||
|     this.instance.on('tileloaderror', (event: TileSourceEvent) => this.tileLoadError.emit(event)); | ||||
|     this.register(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,68 +0,0 @@ | ||||
| import { | ||||
|   AfterContentInit, | ||||
|   Component, | ||||
|   ContentChild, | ||||
|   EventEmitter, | ||||
|   forwardRef, | ||||
|   Host, | ||||
|   Input, | ||||
|   Output, | ||||
| } from '@angular/core'; | ||||
| import { Raster, Source } from 'ol/source'; | ||||
| import { Operation, RasterSourceEvent } from 'ol/source/Raster'; | ||||
|  | ||||
| import { LayerImageComponent } from '../layers/layerimage.component'; | ||||
| import { SourceComponent } from './source.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-source-raster', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
|   providers: [ | ||||
|     { | ||||
|       provide: SourceComponent, | ||||
|       useExisting: forwardRef(() => SourceRasterComponent), | ||||
|     }, | ||||
|   ], | ||||
| }) | ||||
| export class SourceRasterComponent extends SourceComponent implements AfterContentInit { | ||||
|   @Input() | ||||
|   operation?: Operation; | ||||
|   @Input() | ||||
|   threads?: number; | ||||
|   @Input() | ||||
|   lib?: any; | ||||
|   @Input() | ||||
|   operationType?: 'pixel' | 'image'; | ||||
|  | ||||
|   @Output() | ||||
|   beforeOperations = new EventEmitter<RasterSourceEvent>(); | ||||
|   @Output() | ||||
|   afterOperations = new EventEmitter<RasterSourceEvent>(); | ||||
|  | ||||
|   instance: Raster; | ||||
|   sources: Source[] = []; | ||||
|  | ||||
|   @ContentChild(SourceComponent, { static: false }) | ||||
|   set source(sourceComponent: SourceComponent) { | ||||
|     this.sources = [sourceComponent.instance]; | ||||
|     if (this.instance) { | ||||
|       // Openlayer doesn't handle sources update. Just recreate Raster instance. | ||||
|       this.init(); | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   constructor(@Host() layer: LayerImageComponent) { | ||||
|     super(layer); | ||||
|   } | ||||
|  | ||||
|   ngAfterContentInit() { | ||||
|     this.init(); | ||||
|   } | ||||
|  | ||||
|   init() { | ||||
|     this.instance = new Raster(this); | ||||
|     this.instance.on('beforeoperations', (event: RasterSourceEvent) => this.beforeOperations.emit(event)); | ||||
|     this.instance.on('afteroperations', (event: RasterSourceEvent) => this.afterOperations.emit(event)); | ||||
|     this.register(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,28 +0,0 @@ | ||||
| import { Input, OnDestroy, Directive } from '@angular/core'; | ||||
| import Source from 'ol/source/Source'; | ||||
|  | ||||
| import { LayerComponent } from '../layers/layer.component'; | ||||
|  | ||||
| @Directive() | ||||
| // eslint-disable-next-line @angular-eslint/directive-class-suffix | ||||
| export abstract class SourceComponent implements OnDestroy { | ||||
|   @Input() | ||||
|   attributions: any; | ||||
|  | ||||
|   public instance: Source; | ||||
|   public componentType = 'source'; | ||||
|  | ||||
|   protected constructor(protected host: LayerComponent) {} | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     if (this.host && this.host.instance) { | ||||
|       this.host.instance.setSource(null); | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   protected register(s: Source) { | ||||
|     if (this.host) { | ||||
|       this.host.instance.setSource(s); | ||||
|     } | ||||
|   } | ||||
| } | ||||
| @@ -1,25 +0,0 @@ | ||||
| import { Component, Host, Input, OnInit, forwardRef } from '@angular/core'; | ||||
| import { TileJSON } from 'ol/source'; | ||||
| import { LayerTileComponent } from '../layers/layertile.component'; | ||||
| import { SourceComponent } from './source.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-source-tilejson', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
|   providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceTileJSONComponent) }], | ||||
| }) | ||||
| export class SourceTileJSONComponent extends SourceComponent implements OnInit { | ||||
|   @Input() | ||||
|   url: string; | ||||
|  | ||||
|   instance: TileJSON; | ||||
|  | ||||
|   constructor(@Host() layer: LayerTileComponent) { | ||||
|     super(layer); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new TileJSON(this); | ||||
|     this.host.instance.setSource(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,58 +0,0 @@ | ||||
| import { Component, Host, Input, OnChanges, OnInit, forwardRef, SimpleChanges } from '@angular/core'; | ||||
| import { LayerTileComponent } from '../layers/layertile.component'; | ||||
| import { SourceComponent } from './source.component'; | ||||
| import { TileWMS } from 'ol/source'; | ||||
| import TileGrid from 'ol/tilegrid/TileGrid'; | ||||
| import { LoadFunction } from 'ol/Tile'; | ||||
| import { ServerType } from 'ol/source/wms'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-source-tilewms', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
|   providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceTileWMSComponent) }], | ||||
| }) | ||||
| export class SourceTileWMSComponent extends SourceComponent implements OnChanges, OnInit { | ||||
|   @Input() | ||||
|   cacheSize: number; | ||||
|   @Input() | ||||
|   crossOrigin: string; | ||||
|   @Input() | ||||
|   gutter: number; | ||||
|   @Input() | ||||
|   hidpi: boolean; | ||||
|   @Input() | ||||
|   params: { [key: string]: any }; | ||||
|   @Input() | ||||
|   projection: string; | ||||
|   @Input() | ||||
|   reprojectionErrorThreshold: number; | ||||
|   @Input() | ||||
|   serverType: ServerType; | ||||
|   @Input() | ||||
|   tileGrid: TileGrid; | ||||
|   @Input() | ||||
|   tileLoadFunction: LoadFunction; | ||||
|   @Input() | ||||
|   url: string; | ||||
|   @Input() | ||||
|   urls: string[]; | ||||
|   @Input() | ||||
|   wrapX: boolean; | ||||
|  | ||||
|   instance: TileWMS; | ||||
|  | ||||
|   constructor(@Host() layer: LayerTileComponent) { | ||||
|     super(layer); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new TileWMS(this); | ||||
|     this.host.instance.setSource(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnChanges(changes: SimpleChanges) { | ||||
|     if (this.instance && changes.hasOwnProperty('params')) { | ||||
|       this.instance.updateParams(this.params); | ||||
|     } | ||||
|   } | ||||
| } | ||||
| @@ -1,117 +0,0 @@ | ||||
| import { | ||||
|   Component, | ||||
|   Host, | ||||
|   Input, | ||||
|   forwardRef, | ||||
|   AfterContentInit, | ||||
|   ContentChild, | ||||
|   SimpleChanges, | ||||
|   OnChanges, | ||||
|   Output, | ||||
|   EventEmitter, | ||||
| } from '@angular/core'; | ||||
| import { LayerTileComponent } from '../layers/layertile.component'; | ||||
| import { SourceComponent } from './source.component'; | ||||
| import { TileGridWMTSComponent } from '../tilegridwmts.component'; | ||||
| import { WMTS as SourceWMTS } from 'ol/source'; | ||||
| import WMTS from 'ol/tilegrid/WMTS'; | ||||
| import { ProjectionLike } from 'ol/proj'; | ||||
| import { LoadFunction } from 'ol/Tile'; | ||||
| import { TileSourceEvent } from 'ol/source/Tile'; | ||||
| import { RequestEncoding } from 'ol/source/WMTS'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-source-tilewmts', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
|   providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceTileWMTSComponent) }], | ||||
| }) | ||||
| export class SourceTileWMTSComponent extends SourceComponent implements AfterContentInit, OnChanges { | ||||
|   @Input() | ||||
|   cacheSize?: number; | ||||
|   @Input() | ||||
|   crossOrigin?: string; | ||||
|   @Input() | ||||
|   tileGrid: WMTS; | ||||
|   @Input() | ||||
|   projection: ProjectionLike; | ||||
|   @Input() | ||||
|   reprojectionErrorThreshold?: number; | ||||
|   @Input() | ||||
|   requestEncoding?: RequestEncoding | undefined; | ||||
|   @Input() | ||||
|   layer: string; | ||||
|   @Input() | ||||
|   style: string; | ||||
|   @Input() | ||||
|   tileClass?: any; | ||||
|   @Input() | ||||
|   tilePixelRatio?: number; | ||||
|   @Input() | ||||
|   version?: string; | ||||
|   @Input() | ||||
|   format?: string; | ||||
|   @Input() | ||||
|   matrixSet: string; | ||||
|   @Input() | ||||
|   dimensions?: any; | ||||
|   @Input() | ||||
|   url?: string; | ||||
|   @Input() | ||||
|   tileLoadFunction?: LoadFunction; | ||||
|   @Input() | ||||
|   urls?: string[]; | ||||
|   @Input() | ||||
|   wrapX?: boolean; | ||||
|  | ||||
|   @Output() | ||||
|   tileLoadStart = new EventEmitter<TileSourceEvent>(); | ||||
|   @Output() | ||||
|   tileLoadEnd = new EventEmitter<TileSourceEvent>(); | ||||
|   @Output() | ||||
|   tileLoadError = new EventEmitter<TileSourceEvent>(); | ||||
|  | ||||
|   @ContentChild(TileGridWMTSComponent, { static: false }) | ||||
|   tileGridWMTS: TileGridWMTSComponent; | ||||
|  | ||||
|   instance: SourceWMTS; | ||||
|  | ||||
|   constructor(@Host() layer: LayerTileComponent) { | ||||
|     super(layer); | ||||
|   } | ||||
|  | ||||
|   ngOnChanges(changes: SimpleChanges) { | ||||
|     const properties: { [index: string]: any } = {}; | ||||
|     if (!this.instance) { | ||||
|       return; | ||||
|     } | ||||
|     for (const key in changes) { | ||||
|       if (changes.hasOwnProperty(key)) { | ||||
|         switch (key) { | ||||
|           case 'url': | ||||
|             this.url = changes[key].currentValue; | ||||
|             this.setLayerSource(); | ||||
|             break; | ||||
|           default: | ||||
|             break; | ||||
|         } | ||||
|         properties[key] = changes[key].currentValue; | ||||
|       } | ||||
|     } | ||||
|     this.instance.setProperties(properties, false); | ||||
|   } | ||||
|  | ||||
|   setLayerSource(): void { | ||||
|     this.instance = new SourceWMTS(this); | ||||
|     this.instance.on('tileloadstart', (event: TileSourceEvent) => this.tileLoadStart.emit(event)); | ||||
|     this.instance.on('tileloadend', (event: TileSourceEvent) => this.tileLoadEnd.emit(event)); | ||||
|     this.instance.on('tileloaderror', (event: TileSourceEvent) => this.tileLoadError.emit(event)); | ||||
|     this.host.instance.setSource(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngAfterContentInit(): void { | ||||
|     if (this.tileGridWMTS) { | ||||
|       this.tileGrid = this.tileGridWMTS.instance; | ||||
|       this.setLayerSource(); | ||||
|     } | ||||
|   } | ||||
| } | ||||
| @@ -1,26 +0,0 @@ | ||||
| import { Component, Host, Input, OnInit, forwardRef } from '@angular/core'; | ||||
| import { SourceComponent } from './source.component'; | ||||
| import { LayerTileComponent } from '../layers/layertile.component'; | ||||
| import { UTFGrid } from 'ol/source'; | ||||
| import { Config } from 'ol/source/TileJSON'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-source-utfgrid', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
|   providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceUTFGridComponent) }], | ||||
| }) | ||||
| export class SourceUTFGridComponent extends SourceComponent implements OnInit { | ||||
|   @Input() tileJSON: Config; | ||||
|   @Input() url: string; | ||||
|  | ||||
|   instance: UTFGrid; | ||||
|  | ||||
|   constructor(@Host() layer: LayerTileComponent) { | ||||
|     super(layer); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new UTFGrid(this); | ||||
|     this.host.instance.setSource(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,37 +0,0 @@ | ||||
| import { Component, Host, Input, OnInit, forwardRef } from '@angular/core'; | ||||
| 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/source/Vector'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-source-vector', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
|   providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceVectorComponent) }], | ||||
| }) | ||||
| export class SourceVectorComponent extends SourceComponent implements OnInit { | ||||
|   @Input() | ||||
|   overlaps: boolean; | ||||
|   @Input() | ||||
|   useSpatialIndex: boolean; | ||||
|   @Input() | ||||
|   wrapX: boolean; | ||||
|   @Input() | ||||
|   url: string; | ||||
|   @Input() | ||||
|   format: Feature; | ||||
|   @Input() | ||||
|   strategy: LoadingStrategy; | ||||
|  | ||||
|   instance: Vector; | ||||
|  | ||||
|   constructor(@Host() layer: LayerVectorComponent) { | ||||
|     super(layer); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new Vector(this); | ||||
|     this.host.instance.setSource(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,56 +0,0 @@ | ||||
| import { Component, Host, Input, forwardRef, ContentChild, AfterContentInit } from '@angular/core'; | ||||
| import { VectorTile } from 'ol/source'; | ||||
| 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 } from 'ol/proj'; | ||||
| import { UrlFunction } from 'ol/Tile'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-source-vectortile', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
|   providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceVectorTileComponent) }], | ||||
| }) | ||||
| export class SourceVectorTileComponent extends SourceComponent implements AfterContentInit { | ||||
|   @Input() | ||||
|   cacheSize: number; | ||||
|   @Input() | ||||
|   overlaps: boolean; | ||||
|   @Input() | ||||
|   projection: ProjectionLike; | ||||
|   @Input() | ||||
|   tilePixelRatio: number; | ||||
|   @Input() | ||||
|   tileUrlFunction: UrlFunction; | ||||
|   @Input() | ||||
|   url: string; | ||||
|   @Input() | ||||
|   urls: string[]; | ||||
|   @Input() | ||||
|   wrapX: boolean; | ||||
|  | ||||
|   @ContentChild(FormatComponent, { static: false }) | ||||
|   formatComponent: FormatComponent; | ||||
|   @ContentChild(TileGridComponent, { static: false }) | ||||
|   tileGridComponent: TileGridComponent; | ||||
|  | ||||
|   public instance: VectorTile; | ||||
|   format: Feature; | ||||
|   tileGrid: TileGrid; | ||||
|  | ||||
|   constructor(@Host() layer: LayerVectorTileComponent) { | ||||
|     super(layer); | ||||
|   } | ||||
|  | ||||
|   /* need the children to construct the OL3 object */ | ||||
|   ngAfterContentInit() { | ||||
|     this.format = this.formatComponent.instance; | ||||
|     this.tileGrid = this.tileGridComponent.instance; | ||||
|     // console.log('creating ol.source.VectorTile instance with:', this); | ||||
|     this.instance = new VectorTile(this); | ||||
|     this.host.instance.setSource(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,115 +0,0 @@ | ||||
| import { | ||||
|   AfterContentInit, | ||||
|   Component, | ||||
|   ContentChild, | ||||
|   EventEmitter, | ||||
|   forwardRef, | ||||
|   Host, | ||||
|   Input, | ||||
|   OnChanges, | ||||
|   Optional, | ||||
|   Output, | ||||
|   SimpleChanges, | ||||
| } from '@angular/core'; | ||||
| import { Size } from 'ol/size'; | ||||
| import { XYZ } from 'ol/source'; | ||||
| import { TileSourceEvent } from 'ol/source/Tile'; | ||||
| import { LoadFunction, UrlFunction } from 'ol/Tile'; | ||||
| import TileGrid from 'ol/tilegrid/TileGrid'; | ||||
|  | ||||
| import { LayerTileComponent } from '../layers/layertile.component'; | ||||
| import { TileGridComponent } from '../tilegrid.component'; | ||||
| import { SourceComponent } from './source.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-source-xyz', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
|   providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceXYZComponent) }], | ||||
| }) | ||||
| export class SourceXYZComponent extends SourceComponent implements AfterContentInit, OnChanges { | ||||
|   @Input() | ||||
|   cacheSize: number; | ||||
|   @Input() | ||||
|   crossOrigin: string; | ||||
|   @Input() | ||||
|   opaque: boolean; | ||||
|   @Input() | ||||
|   projection: string; | ||||
|   @Input() | ||||
|   reprojectionErrorThreshold: number; | ||||
|   @Input() | ||||
|   minZoom: number; | ||||
|   @Input() | ||||
|   maxZoom: number; | ||||
|   @Input() | ||||
|   tileGrid: TileGrid; | ||||
|   @Input() | ||||
|   tileLoadFunction?: LoadFunction; | ||||
|   @Input() | ||||
|   tilePixelRatio: number; | ||||
|   @Input() | ||||
|   tileSize: number | Size; | ||||
|   @Input() | ||||
|   tileUrlFunction?: UrlFunction; | ||||
|   @Input() | ||||
|   url: string; | ||||
|   @Input() | ||||
|   urls: string[]; | ||||
|   @Input() | ||||
|   wrapX: boolean; | ||||
|  | ||||
|   @ContentChild(TileGridComponent, { static: false }) | ||||
|   tileGridXYZ: TileGridComponent; | ||||
|  | ||||
|   @Output() | ||||
|   tileLoadStart = new EventEmitter<TileSourceEvent>(); | ||||
|   @Output() | ||||
|   tileLoadEnd = new EventEmitter<TileSourceEvent>(); | ||||
|   @Output() | ||||
|   tileLoadError = new EventEmitter<TileSourceEvent>(); | ||||
|  | ||||
|   instance: XYZ; | ||||
|  | ||||
|   constructor( | ||||
|     @Optional() | ||||
|     @Host() | ||||
|     protected layer?: LayerTileComponent | ||||
|   ) { | ||||
|     super(layer); | ||||
|   } | ||||
|  | ||||
|   ngAfterContentInit() { | ||||
|     if (this.tileGridXYZ) { | ||||
|       this.tileGrid = this.tileGridXYZ.instance; | ||||
|     } | ||||
|     this.init(); | ||||
|   } | ||||
|  | ||||
|   ngOnChanges(changes: SimpleChanges) { | ||||
|     const properties: { [index: string]: any } = {}; | ||||
|  | ||||
|     if (!this.instance) { | ||||
|       return; | ||||
|     } | ||||
|     for (const key in changes) { | ||||
|       if (changes.hasOwnProperty(key)) { | ||||
|         properties[key] = changes[key].currentValue; | ||||
|       } | ||||
|     } | ||||
|  | ||||
|     this.instance.setProperties(properties, false); | ||||
|     if (changes.hasOwnProperty('url')) { | ||||
|       this.init(); | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   init() { | ||||
|     this.instance = new XYZ(this); | ||||
|  | ||||
|     this.instance.on('tileloadstart', (event: TileSourceEvent) => this.tileLoadStart.emit(event)); | ||||
|     this.instance.on('tileloadend', (event: TileSourceEvent) => this.tileLoadEnd.emit(event)); | ||||
|     this.instance.on('tileloaderror', (event: TileSourceEvent) => this.tileLoadError.emit(event)); | ||||
|  | ||||
|     this.register(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,58 +0,0 @@ | ||||
| import { Component, Input, Host, AfterContentInit, OnChanges, OnDestroy, SimpleChanges } from '@angular/core'; | ||||
| import { Circle, Fill, Stroke } from 'ol/style'; | ||||
| import { StyleComponent } from './style.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-style-circle', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
| }) | ||||
| export class StyleCircleComponent implements AfterContentInit, OnChanges, OnDestroy { | ||||
|   @Input() | ||||
|   fill: Fill; | ||||
|   @Input() | ||||
|   radius: number; | ||||
|   @Input() | ||||
|   snapToPixel: boolean; | ||||
|   @Input() | ||||
|   stroke: Stroke; | ||||
|  | ||||
|   public componentType = 'style-circle'; | ||||
|   public instance: Circle; | ||||
|  | ||||
|   constructor(@Host() private host: StyleComponent) {} | ||||
|  | ||||
|   /** | ||||
|    * WORK-AROUND: since the re-rendering is not triggered on style change | ||||
|    * we trigger a radius change. | ||||
|    * see openlayers #6233 and #5775 | ||||
|    */ | ||||
|   update() { | ||||
|     if (!!this.instance) { | ||||
|       // console.log('setting ol.style.Circle instance\'s radius'); | ||||
|       this.instance.setRadius(this.radius); | ||||
|     } | ||||
|     this.host.update(); | ||||
|   } | ||||
|  | ||||
|   ngAfterContentInit() { | ||||
|     // console.log('creating ol.style.Circle instance with: ', this); | ||||
|     this.instance = new Circle(this); | ||||
|     this.host.instance.setImage(this.instance); | ||||
|     this.host.update(); | ||||
|   } | ||||
|  | ||||
|   ngOnChanges(changes: SimpleChanges) { | ||||
|     if (!this.instance) { | ||||
|       return; | ||||
|     } | ||||
|     if (changes.radius) { | ||||
|       this.instance.setRadius(changes.radius.currentValue); | ||||
|     } | ||||
|     // console.log('changes detected in aol-style-circle, setting new radius: ', changes['radius'].currentValue); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     // console.log('removing aol-style-circle'); | ||||
|     this.host.instance.setImage(null); | ||||
|   } | ||||
| } | ||||
| @@ -1,68 +0,0 @@ | ||||
| import { Component, Input, Optional, OnInit, OnChanges, SimpleChanges } from '@angular/core'; | ||||
| import { Fill } from 'ol/style'; | ||||
| import { StyleComponent } from './style.component'; | ||||
| import { StyleCircleComponent } from './circle.component'; | ||||
| import { StyleTextComponent } from './text.component'; | ||||
| import { Color } from 'ol/color'; | ||||
| import { ColorLike } from 'ol/colorlike'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-style-fill', | ||||
|   template: ` <div class="aol-style-fill"></div> `, | ||||
| }) | ||||
| export class StyleFillComponent implements OnInit, OnChanges { | ||||
|   @Input() | ||||
|   color: Color | ColorLike; | ||||
|  | ||||
|   public instance: Fill; | ||||
|   private readonly host: StyleComponent | StyleCircleComponent | StyleTextComponent; | ||||
|  | ||||
|   constructor( | ||||
|     @Optional() styleHost: StyleComponent, | ||||
|     @Optional() styleCircleHost: StyleCircleComponent, | ||||
|     @Optional() styleTextHost: StyleTextComponent | ||||
|   ) { | ||||
|     if (!styleHost) { | ||||
|       throw new Error('aol-style-stroke must be a descendant of aol-style'); | ||||
|     } | ||||
|     if (!!styleTextHost) { | ||||
|       this.host = styleTextHost; | ||||
|     } else if (!!styleCircleHost) { | ||||
|       this.host = styleCircleHost; | ||||
|     } else { | ||||
|       this.host = styleHost; | ||||
|     } | ||||
|     // console.log('creating aol-style-fill with: ', this); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     // console.log('creating ol.style.Fill instance with: ', this); | ||||
|     this.instance = new Fill(this); | ||||
|     switch (this.host.componentType) { | ||||
|       case 'style': | ||||
|         this.host.instance.setFill(this.instance); | ||||
|         // console.log('setting ol.style instance\'s fill:', this.host); | ||||
|         break; | ||||
|       case 'style-text': | ||||
|         this.host.instance.setFill(this.instance); | ||||
|         break; | ||||
|       case 'style-circle': | ||||
|         (this.host as StyleCircleComponent).fill = this.instance; | ||||
|         // console.log('setting ol.style.circle instance\'s fill:', this.host); | ||||
|         break; | ||||
|       default: | ||||
|         throw new Error('unknown host type: ' + this.host); | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   ngOnChanges(changes: SimpleChanges) { | ||||
|     if (!this.instance) { | ||||
|       return; | ||||
|     } | ||||
|     if (changes.color) { | ||||
|       this.instance.setColor(changes.color.currentValue); | ||||
|     } | ||||
|     this.host.update(); | ||||
|     // console.log('changes detected in aol-style-fill, setting new color: ', changes); | ||||
|   } | ||||
| } | ||||
| @@ -1,80 +0,0 @@ | ||||
| import { Component, Input, Host, OnInit, OnChanges, SimpleChanges } from '@angular/core'; | ||||
| import { Icon } from 'ol/style'; | ||||
|  | ||||
| // TODO https://github.com/openlayers/openlayers/issues/12694 | ||||
| // import IconAnchorUnits from 'ol/style/IconAnchorUnits'; | ||||
| // import IconOrigin from 'ol/style/IconOrigin'; | ||||
| import { StyleComponent } from './style.component'; | ||||
| import { IconAnchorUnits, IconOrigin } from 'ol/style/Icon'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-style-icon', | ||||
|   template: ` <div class="aol-style-icon"></div> `, | ||||
| }) | ||||
| export class StyleIconComponent implements OnInit, OnChanges { | ||||
|   @Input() | ||||
|   anchor: [number, number]; | ||||
|   @Input() | ||||
|   anchorXUnits: IconAnchorUnits; | ||||
|   @Input() | ||||
|   anchorYUnits: IconAnchorUnits; | ||||
|   @Input() | ||||
|   anchorOrigin: IconOrigin; | ||||
|   @Input() | ||||
|   color: [number, number, number, number]; | ||||
|   @Input() | ||||
|   crossOrigin: IconOrigin; | ||||
|   @Input() | ||||
|   img: HTMLCanvasElement | HTMLImageElement; | ||||
|   @Input() | ||||
|   offset: [number, number]; | ||||
|   @Input() | ||||
|   offsetOrigin: IconOrigin; | ||||
|   @Input() | ||||
|   opacity: number; | ||||
|   @Input() | ||||
|   scale: number; | ||||
|   @Input() | ||||
|   snapToPixel: boolean; | ||||
|   @Input() | ||||
|   rotateWithView: boolean; | ||||
|   @Input() | ||||
|   rotation: number; | ||||
|   @Input() | ||||
|   size: [number, number]; | ||||
|   @Input() | ||||
|   imgSize: [number, number]; | ||||
|   @Input() | ||||
|   src: string; | ||||
|  | ||||
|   public instance: Icon; | ||||
|  | ||||
|   constructor(@Host() private host: StyleComponent) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     // console.log('creating ol.style.Icon instance with: ', this); | ||||
|     this.instance = new Icon(this); | ||||
|     this.host.instance.setImage(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnChanges(changes: SimpleChanges) { | ||||
|     if (!this.instance) { | ||||
|       return; | ||||
|     } | ||||
|     if (changes.opacity) { | ||||
|       this.instance.setOpacity(changes.opacity.currentValue); | ||||
|     } | ||||
|     if (changes.rotation) { | ||||
|       this.instance.setRotation(changes.rotation.currentValue); | ||||
|     } | ||||
|     if (changes.scale) { | ||||
|       this.instance.setScale(changes.scale.currentValue); | ||||
|     } | ||||
|     if (changes.src) { | ||||
|       this.instance = new Icon(this); | ||||
|       this.host.instance.setImage(this.instance); | ||||
|     } | ||||
|     this.host.update(); | ||||
|     // console.log('changes detected in aol-style-icon: ', changes); | ||||
|   } | ||||
| } | ||||
| @@ -1,95 +0,0 @@ | ||||
| import { Component, Input, Optional, OnInit, OnChanges, SimpleChanges } from '@angular/core'; | ||||
| import { Stroke } from 'ol/style'; | ||||
| import { StyleComponent } from './style.component'; | ||||
| import { StyleCircleComponent } from './circle.component'; | ||||
| import { StyleTextComponent } from './text.component'; | ||||
| import { Color } from 'ol/color'; | ||||
| import { ColorLike } from 'ol/colorlike'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-style-stroke', | ||||
|   template: ` <div class="aol-style-stroke"></div> `, | ||||
| }) | ||||
| export class StyleStrokeComponent implements OnInit, OnChanges { | ||||
|   @Input() | ||||
|   color: Color | ColorLike; | ||||
|   @Input() | ||||
|   lineCap: CanvasLineCap | undefined; | ||||
|   @Input() | ||||
|   lineDash: number[]; | ||||
|   @Input() | ||||
|   lineJoin: CanvasLineJoin | undefined; | ||||
|   @Input() | ||||
|   miterLimit: number; | ||||
|   @Input() | ||||
|   width: number; | ||||
|  | ||||
|   public instance: Stroke; | ||||
|   /* the typings do not have the setters */ | ||||
|   private readonly host: StyleComponent | StyleCircleComponent | StyleTextComponent; | ||||
|  | ||||
|   constructor( | ||||
|     @Optional() styleHost: StyleComponent, | ||||
|     @Optional() styleCircleHost: StyleCircleComponent, | ||||
|     @Optional() styleTextHost: StyleTextComponent | ||||
|   ) { | ||||
|     if (!styleHost) { | ||||
|       throw new Error('aol-style-stroke must be a descendant of aol-style'); | ||||
|     } | ||||
|     if (!!styleTextHost) { | ||||
|       this.host = styleTextHost; | ||||
|     } else if (!!styleCircleHost) { | ||||
|       this.host = styleCircleHost; | ||||
|     } else { | ||||
|       this.host = styleHost; | ||||
|     } | ||||
|     // console.log('creating aol-style-stroke with: ', this); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     // console.log('creating ol.style.Stroke instance with: ', this); | ||||
|     this.instance = new Stroke(this); | ||||
|     switch (this.host.componentType) { | ||||
|       case 'style': | ||||
|         this.host.instance.setStroke(this.instance); | ||||
|         // console.log('setting ol.style instance\'s stroke:', this.host); | ||||
|         break; | ||||
|       case 'style-text': | ||||
|         this.host.instance.setStroke(this.instance); | ||||
|         break; | ||||
|       case 'style-circle': | ||||
|         (this.host as StyleCircleComponent).stroke = this.instance; | ||||
|         // console.log('setting ol.style.circle instance\'s stroke:', this.host); | ||||
|         break; | ||||
|       default: | ||||
|         throw new Error('unknown host type: ' + this.host); | ||||
|       // break; | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   ngOnChanges(changes: SimpleChanges) { | ||||
|     if (!this.instance) { | ||||
|       return; | ||||
|     } | ||||
|     if (changes.color) { | ||||
|       this.instance.setColor(changes.color.currentValue); | ||||
|     } | ||||
|     if (changes.lineCap) { | ||||
|       this.instance.setLineCap(changes.lineCap.currentValue); | ||||
|     } | ||||
|     if (changes.lineDash) { | ||||
|       this.instance.setLineDash(changes.lineDash.currentValue); | ||||
|     } | ||||
|     if (changes.lineJoin) { | ||||
|       this.instance.setLineJoin(changes.lineJoin.currentValue); | ||||
|     } | ||||
|     if (changes.miterLimit) { | ||||
|       this.instance.setMiterLimit(changes.miterLimit.currentValue); | ||||
|     } | ||||
|     if (changes.width) { | ||||
|       this.instance.setWidth(changes.width.currentValue); | ||||
|     } | ||||
|     this.host.update(); | ||||
|     // console.log('changes detected in aol-style-stroke, setting new properties: ', changes); | ||||
|   } | ||||
| } | ||||
| @@ -1,48 +0,0 @@ | ||||
| import { Component, Input, Optional, OnInit } from '@angular/core'; | ||||
| 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 { GeometryFunction } from 'ol/style/Style'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-style', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
| }) | ||||
| export class StyleComponent implements OnInit { | ||||
|   @Input() | ||||
|   geometry: string | Geometry | GeometryFunction; | ||||
|   @Input() | ||||
|   fill: Fill; | ||||
|   @Input() | ||||
|   image: Image; | ||||
|   @Input() | ||||
|   stroke: Stroke; | ||||
|   @Input() | ||||
|   text: Text; | ||||
|   @Input() | ||||
|   zIndex: number; | ||||
|  | ||||
|   public instance: Style; | ||||
|   public componentType = 'style'; | ||||
|   private readonly host: FeatureComponent | LayerVectorComponent; | ||||
|  | ||||
|   constructor(@Optional() featureHost: FeatureComponent, @Optional() layerHost: LayerVectorComponent) { | ||||
|     // console.log('creating aol-style'); | ||||
|     this.host = !!featureHost ? featureHost : layerHost; | ||||
|     if (!this.host) { | ||||
|       throw new Error('aol-style must be applied to a feature or a layer'); | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   update() { | ||||
|     // console.log('updating style\'s host: ', this.host); | ||||
|     this.host.instance.changed(); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     // console.log('creating aol-style instance with: ', this); | ||||
|     this.instance = new Style(this); | ||||
|     this.host.instance.setStyle(this.instance); | ||||
|   } | ||||
| } | ||||
| @@ -1,78 +0,0 @@ | ||||
| import { Component, Input, Optional, OnInit, OnChanges, SimpleChanges } from '@angular/core'; | ||||
| import { Text } from 'ol/style'; | ||||
| import { StyleComponent } from './style.component'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-style-text', | ||||
|   template: ` <div class="aol-style-text"></div> `, | ||||
| }) | ||||
| export class StyleTextComponent implements OnInit, OnChanges { | ||||
|   @Input() | ||||
|   font: string | undefined; | ||||
|   @Input() | ||||
|   offsetX: number | undefined; | ||||
|   @Input() | ||||
|   offsetY: number | undefined; | ||||
|   @Input() | ||||
|   scale: number | undefined; | ||||
|   @Input() | ||||
|   rotateWithView: boolean | undefined; | ||||
|   @Input() | ||||
|   rotation: number | undefined; | ||||
|   @Input() | ||||
|   text: string | undefined; | ||||
|   @Input() | ||||
|   textAlign: CanvasTextAlign | undefined; | ||||
|   @Input() | ||||
|   textBaseLine: string | undefined; | ||||
|  | ||||
|   public instance: Text; | ||||
|   public componentType = 'style-text'; | ||||
|  | ||||
|   constructor(@Optional() private host: StyleComponent) { | ||||
|     if (!host) { | ||||
|       throw new Error('aol-style-text must be a descendant of aol-style'); | ||||
|     } | ||||
|     // console.log('creating aol-style-text with: ', this); | ||||
|   } | ||||
|  | ||||
|   ngOnInit() { | ||||
|     // console.log('creating ol.style.Text instance with: ', this); | ||||
|     this.instance = new Text(this); | ||||
|     this.host.instance.setText(this.instance); | ||||
|   } | ||||
|  | ||||
|   ngOnChanges(changes: SimpleChanges) { | ||||
|     if (!this.instance) { | ||||
|       return; | ||||
|     } | ||||
|     if (changes.font) { | ||||
|       this.instance.setFont(changes.font.currentValue); | ||||
|     } | ||||
|     if (changes.offsetX) { | ||||
|       this.instance.setOffsetX(changes.offsetX.currentValue); | ||||
|     } | ||||
|     if (changes.offsetY) { | ||||
|       this.instance.setOffsetY(changes.offsetY.currentValue); | ||||
|     } | ||||
|     if (changes.scale) { | ||||
|       this.instance.setScale(changes.scale.currentValue); | ||||
|     } | ||||
|     if (changes.rotation) { | ||||
|       this.instance.setRotation(changes.rotation.currentValue); | ||||
|     } | ||||
|     if (changes.text) { | ||||
|       this.instance.setText(changes.text.currentValue); | ||||
|     } | ||||
|     if (changes.textAlign) { | ||||
|       this.instance.setTextAlign(changes.textAlign.currentValue); | ||||
|     } | ||||
|     if (changes.textBaseLine) { | ||||
|       this.instance.setTextBaseline(changes.textBaseLine.currentValue); | ||||
|     } | ||||
|     this.host.update(); | ||||
|     // console.log('changes detected in aol-style-text, setting new properties: ', changes); | ||||
|   } | ||||
|  | ||||
|   update() {} | ||||
| } | ||||
| @@ -1,43 +0,0 @@ | ||||
| import { Component, Input, OnChanges, OnInit, SimpleChanges } from '@angular/core'; | ||||
| import { createXYZ } from 'ol/tilegrid'; | ||||
| import TileGrid from 'ol/tilegrid/TileGrid'; | ||||
| import { Extent } from 'ol/extent'; | ||||
| import { Coordinate } from 'ol/coordinate'; | ||||
| import { Size } from 'ol/size'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-tilegrid', | ||||
|   template: '', | ||||
| }) | ||||
| export class TileGridComponent implements OnInit, OnChanges { | ||||
|   @Input() | ||||
|   extent: Extent; | ||||
|   @Input() | ||||
|   maxZoom: number; | ||||
|   @Input() | ||||
|   minZoom: number; | ||||
|   @Input() | ||||
|   tileSize: number | Size; | ||||
|   @Input() | ||||
|   origin?: Coordinate; | ||||
|   @Input() | ||||
|   resolutions: number[]; | ||||
|  | ||||
|   instance: TileGrid; | ||||
|  | ||||
|   ngOnInit() { | ||||
|     if (!this.resolutions) { | ||||
|       this.instance = createXYZ(this); | ||||
|     } else { | ||||
|       this.instance = new TileGrid(this); | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   ngOnChanges(changes: SimpleChanges) { | ||||
|     if (!this.resolutions) { | ||||
|       this.instance = createXYZ(this); | ||||
|     } else { | ||||
|       this.instance = new TileGrid(this); | ||||
|     } | ||||
|   } | ||||
| } | ||||
| @@ -1,32 +0,0 @@ | ||||
| import { Component, Input, OnInit } from '@angular/core'; | ||||
| import WMTS from 'ol/tilegrid/WMTS'; | ||||
| import { TileGridComponent } from './tilegrid.component'; | ||||
| import { Coordinate } from 'ol/coordinate'; | ||||
| import { Size } from 'ol/size'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-tilegrid-wmts', | ||||
|   template: '', | ||||
| }) | ||||
| export class TileGridWMTSComponent extends TileGridComponent implements OnInit { | ||||
|   @Input() | ||||
|   origin?: Coordinate; | ||||
|   @Input() | ||||
|   origins?: Coordinate[]; | ||||
|   @Input() | ||||
|   resolutions: number[]; | ||||
|   @Input() | ||||
|   matrixIds: string[]; | ||||
|   @Input() | ||||
|   sizes?: Size[]; | ||||
|   @Input() | ||||
|   tileSizes?: Size[]; | ||||
|   @Input() | ||||
|   widths?: number[]; | ||||
|  | ||||
|   instance: WMTS; | ||||
|  | ||||
|   ngOnInit() { | ||||
|     this.instance = new WMTS(this); | ||||
|   } | ||||
| } | ||||
| @@ -1,127 +0,0 @@ | ||||
| import { Component, Input, OnInit, OnChanges, OnDestroy, SimpleChanges, EventEmitter, Output } from '@angular/core'; | ||||
| import View from 'ol/View'; | ||||
| import { MapComponent } from './map.component'; | ||||
| import { ObjectEvent } from 'ol/Object'; | ||||
| import { Extent } from 'ol/extent'; | ||||
| import { Coordinate } from 'ol/coordinate'; | ||||
| import { DrawEvent } from 'ol/interaction/Draw'; | ||||
| import BaseEvent from 'ol/events/Event'; | ||||
|  | ||||
| @Component({ | ||||
|   selector: 'aol-view', | ||||
|   template: ` <ng-content></ng-content> `, | ||||
| }) | ||||
| export class ViewComponent implements OnInit, OnChanges, OnDestroy { | ||||
|   @Input() | ||||
|   constrainRotation: boolean | number; | ||||
|   @Input() | ||||
|   enableRotation: boolean; | ||||
|   @Input() | ||||
|   extent: Extent; | ||||
|   @Input() | ||||
|   maxResolution: number; | ||||
|   @Input() | ||||
|   minResolution: number; | ||||
|   @Input() | ||||
|   maxZoom: number; | ||||
|   @Input() | ||||
|   minZoom: number; | ||||
|   @Input() | ||||
|   resolution: number; | ||||
|   @Input() | ||||
|   resolutions: number[]; | ||||
|   @Input() | ||||
|   rotation: number; | ||||
|   @Input() | ||||
|   zoom: number; | ||||
|   @Input() | ||||
|   zoomFactor: number; | ||||
|   @Input() | ||||
|   center: Coordinate; | ||||
|   @Input() | ||||
|   projection: string; | ||||
|   @Input() | ||||
|   constrainOnlyCenter: boolean; | ||||
|   @Input() | ||||
|   smoothExtentConstraint: boolean; | ||||
|   @Input() | ||||
|   constrainResolution: boolean; | ||||
|   @Input() | ||||
|   smoothResolutionConstraint: boolean; | ||||
|   @Input() | ||||
|   showFullExtent: boolean; | ||||
|   @Input() | ||||
|   multiWorld: boolean; | ||||
|  | ||||
|   @Input() | ||||
|   zoomAnimation = false; | ||||
|  | ||||
|   @Output() | ||||
|   olChange = new EventEmitter<DrawEvent>(); | ||||
|   @Output() | ||||
|   changeCenter = new EventEmitter<ObjectEvent>(); | ||||
|   @Output() | ||||
|   changeResolution = new EventEmitter<ObjectEvent>(); | ||||
|   @Output() | ||||
|   changeRotation = new EventEmitter<ObjectEvent>(); | ||||
|   @Output() | ||||
|   olError = new EventEmitter<BaseEvent>(); | ||||
|   @Output() | ||||
|   propertyChange = new EventEmitter<ObjectEvent>(); | ||||
|  | ||||
|   public instance: View; | ||||
|   public componentType = 'view'; | ||||
|  | ||||
|   constructor(private host: MapComponent) {} | ||||
|  | ||||
|   ngOnInit() { | ||||
|     // console.log('creating ol.View instance with: ', this); | ||||
|     this.instance = new View(this); | ||||
|     this.host.instance.setView(this.instance); | ||||
|  | ||||
|     this.instance.on('change', (event: DrawEvent) => this.olChange.emit(event)); | ||||
|     this.instance.on('change:center', (event: ObjectEvent) => this.changeCenter.emit(event)); | ||||
|     this.instance.on('change:resolution', (event: ObjectEvent) => this.changeResolution.emit(event)); | ||||
|     this.instance.on('change:rotation', (event: ObjectEvent) => this.changeRotation.emit(event)); | ||||
|     this.instance.on('error', (event: BaseEvent) => this.olError.emit(event)); | ||||
|     this.instance.on('propertychange', (event: ObjectEvent) => this.propertyChange.emit(event)); | ||||
|   } | ||||
|  | ||||
|   ngOnChanges(changes: SimpleChanges) { | ||||
|     const properties: { [index: string]: any } = {}; | ||||
|     if (!this.instance) { | ||||
|       return; | ||||
|     } | ||||
|     for (const key in changes) { | ||||
|       if (changes.hasOwnProperty(key)) { | ||||
|         switch (key) { | ||||
|           case 'zoom': | ||||
|             /** Work-around: setting the zoom via setProperties does not work. */ | ||||
|             if (this.zoomAnimation) { | ||||
|               this.instance.animate({ zoom: changes[key].currentValue }); | ||||
|             } else { | ||||
|               this.instance.setZoom(changes[key].currentValue); | ||||
|             } | ||||
|             break; | ||||
|           case 'projection': | ||||
|             this.instance = new View(this); | ||||
|             this.host.instance.setView(this.instance); | ||||
|             break; | ||||
|           case 'center': | ||||
|             /** Work-around: setting the center via setProperties does not work. */ | ||||
|             this.instance.setCenter(changes[key].currentValue); | ||||
|             break; | ||||
|           default: | ||||
|             break; | ||||
|         } | ||||
|         properties[key] = changes[key].currentValue; | ||||
|       } | ||||
|     } | ||||
|     // console.log('changes detected in aol-view, setting new properties: ', properties); | ||||
|     this.instance.setProperties(properties, false); | ||||
|   } | ||||
|  | ||||
|   ngOnDestroy() { | ||||
|     // console.log('removing aol-view'); | ||||
|   } | ||||
| } | ||||
| @@ -1,250 +0,0 @@ | ||||
| /* | ||||
|  * Public API Surface of ng-openlayers | ||||
|  */ | ||||
| import { NgModule } from '@angular/core'; | ||||
| import { CommonModule } from '@angular/common'; | ||||
| import { SimpleGeometryComponent } from './lib/geom/simplegeometry.component'; | ||||
| import { SourceComponent } from './lib/sources/source.component'; | ||||
| import { ViewComponent } from './lib/view.component'; | ||||
| import { GraticuleComponent } from './lib/graticule.component'; | ||||
| import { LayerGroupComponent } from './lib/layers/layergroup.component'; | ||||
| import { LayerImageComponent } from './lib/layers/layerimage.component'; | ||||
| import { LayerTileComponent } from './lib/layers/layertile.component'; | ||||
| import { MapComponent } from './lib/map.component'; | ||||
| import { LayerVectorComponent } from './lib/layers/layervector.component'; | ||||
| import { LayerVectorTileComponent } from './lib/layers/layervectortile.component'; | ||||
| import { SourceOsmComponent } from './lib/sources/osm.component'; | ||||
| import { SourceBingmapsComponent } from './lib/sources/bingmaps.component'; | ||||
| import { SourceClusterComponent } from './lib/sources/cluster.component'; | ||||
| import { SourceVectorComponent } from './lib/sources/vector.component'; | ||||
| import { SourceXYZComponent } from './lib/sources/xyz.component'; | ||||
| import { SourceTileWMTSComponent } from './lib/sources/tilewmts.component'; | ||||
| import { SourceVectorTileComponent } from './lib/sources/vectortile.component'; | ||||
| import { SourceTileWMSComponent } from './lib/sources/tilewms.component'; | ||||
| import { SourceTileJSONComponent } from './lib/sources/tilejson.component'; | ||||
| import { SourceGeoJSONComponent } from './lib/sources/geojson.component'; | ||||
| import { SourceImageStaticComponent } from './lib/sources/imagestatic.component'; | ||||
| import { SourceImageWMSComponent } from './lib/sources/imagewms.component'; | ||||
| import { SourceImageArcGISRestComponent } from './lib/sources/imagearcgisrest.component'; | ||||
| import { SourceRasterComponent } from './lib/sources/raster.component'; | ||||
| import { FeatureComponent } from './lib/feature.component'; | ||||
| import { GeometryCircleComponent } from './lib/geom/geometrycircle.component'; | ||||
| import { GeometryLinestringComponent } from './lib/geom/geometrylinestring.component'; | ||||
| import { GeometryMultiLinestringComponent } from './lib/geom/geometrymultilinestring.component'; | ||||
| import { GeometryMultiPointComponent } from './lib/geom/geometrymultipoint.component'; | ||||
| import { GeometryMultiPolygonComponent } from './lib/geom/geometrymultipolygon.component'; | ||||
| import { GeometryPointComponent } from './lib/geom/geometrypoint.component'; | ||||
| import { GeometryPolygonComponent } from './lib/geom/geometrypolygon.component'; | ||||
| import { CoordinateComponent } from './lib/coordinate.component'; | ||||
| import { CollectionCoordinatesComponent } from './lib/collectioncoordinates.component'; | ||||
| import { StyleComponent } from './lib/styles/style.component'; | ||||
| import { StyleCircleComponent } from './lib/styles/circle.component'; | ||||
| import { StyleStrokeComponent } from './lib/styles/stroke.component'; | ||||
| import { StyleIconComponent } from './lib/styles/icon.component'; | ||||
| import { StyleFillComponent } from './lib/styles/fill.component'; | ||||
| import { StyleTextComponent } from './lib/styles/text.component'; | ||||
| import { DefaultControlComponent } from './lib/controls/default.component'; | ||||
| import { ControlComponent } from './lib/controls/control.component'; | ||||
| import { ControlAttributionComponent } from './lib/controls/attribution.component'; | ||||
| import { ControlFullScreenComponent } from './lib/controls/fullscreen.component'; | ||||
| import { ControlMousePositionComponent } from './lib/controls/mouseposition.component'; | ||||
| import { ControlOverviewMapComponent } from './lib/controls/overviewmap.component'; | ||||
| import { ControlRotateComponent } from './lib/controls/rotate.component'; | ||||
| import { ControlScaleLineComponent } from './lib/controls/scaleline.component'; | ||||
| import { ControlZoomComponent } from './lib/controls/zoom.component'; | ||||
| import { ControlZoomSliderComponent } from './lib/controls/zoomslider.component'; | ||||
| import { ControlZoomToExtentComponent } from './lib/controls/zoomtoextent.component'; | ||||
| import { FormatMVTComponent } from './lib/formats/mvt.component'; | ||||
| import { TileGridComponent } from './lib/tilegrid.component'; | ||||
| import { TileGridWMTSComponent } from './lib/tilegridwmts.component'; | ||||
| import { DefaultInteractionComponent } from './lib/interactions/default.component'; | ||||
| import { DoubleClickZoomInteractionComponent } from './lib/interactions/doubleclickzoom.component'; | ||||
| import { DragAndDropInteractionComponent } from './lib/interactions/draganddrop.component'; | ||||
| import { DragBoxInteractionComponent } from './lib/interactions/dragbox.component'; | ||||
| import { DragPanInteractionComponent } from './lib/interactions/dragpan.component'; | ||||
| import { DragRotateInteractionComponent } from './lib/interactions/dragrotate.component'; | ||||
| import { DragRotateAndZoomInteractionComponent } from './lib/interactions/dragrotateandzoom.component'; | ||||
| import { DragZoomInteractionComponent } from './lib/interactions/dragzoom.component'; | ||||
| import { MouseWheelZoomInteractionComponent } from './lib/interactions/mousewheelzoom.component'; | ||||
| import { PinchZoomInteractionComponent } from './lib/interactions/pinchzoom.component'; | ||||
| import { DrawInteractionComponent } from './lib/interactions/draw.component'; | ||||
| import { KeyboardPanInteractionComponent } from './lib/interactions/keyboardpan.component'; | ||||
| import { KeyboardZoomInteractionComponent } from './lib/interactions/keyboardzoom.component'; | ||||
| import { SelectInteractionComponent } from './lib/interactions/select.component'; | ||||
| import { ModifyInteractionComponent } from './lib/interactions/modify.component'; | ||||
| import { TranslateInteractionComponent } from './lib/interactions/translate.component'; | ||||
| import { OverlayComponent } from './lib/overlay.component'; | ||||
| import { ContentComponent } from './lib/content.component'; | ||||
| import { AttributionsComponent } from './lib/attributions.component'; | ||||
| import { AttributionComponent } from './lib/attribution.component'; | ||||
| import { SourceUTFGridComponent } from './lib/sources/utfgrid.component'; | ||||
| import { LayerComponent } from './lib/layers/layer.component'; | ||||
|  | ||||
| export { | ||||
|   MapComponent, | ||||
|   ViewComponent, | ||||
|   GraticuleComponent, | ||||
|   LayerComponent, | ||||
|   LayerGroupComponent, | ||||
|   LayerImageComponent, | ||||
|   LayerTileComponent, | ||||
|   LayerVectorComponent, | ||||
|   LayerVectorTileComponent, | ||||
|   SourceComponent, | ||||
|   SourceOsmComponent, | ||||
|   SourceBingmapsComponent, | ||||
|   SourceClusterComponent, | ||||
|   SourceUTFGridComponent, | ||||
|   SourceVectorComponent, | ||||
|   SourceXYZComponent, | ||||
|   SourceVectorTileComponent, | ||||
|   SourceTileWMSComponent, | ||||
|   SourceTileWMTSComponent, | ||||
|   SourceTileJSONComponent, | ||||
|   SourceGeoJSONComponent, | ||||
|   SourceImageStaticComponent, | ||||
|   SourceImageWMSComponent, | ||||
|   SourceRasterComponent, | ||||
|   SourceImageArcGISRestComponent, | ||||
|   SimpleGeometryComponent, | ||||
|   FeatureComponent, | ||||
|   GeometryLinestringComponent, | ||||
|   GeometryMultiLinestringComponent, | ||||
|   GeometryMultiPointComponent, | ||||
|   GeometryMultiPolygonComponent, | ||||
|   GeometryPointComponent, | ||||
|   GeometryPolygonComponent, | ||||
|   GeometryCircleComponent, | ||||
|   CoordinateComponent, | ||||
|   CollectionCoordinatesComponent, | ||||
|   StyleComponent, | ||||
|   StyleCircleComponent, | ||||
|   StyleFillComponent, | ||||
|   StyleIconComponent, | ||||
|   StyleStrokeComponent, | ||||
|   StyleTextComponent, | ||||
|   DefaultControlComponent, | ||||
|   ControlComponent, | ||||
|   ControlAttributionComponent, | ||||
|   ControlFullScreenComponent, | ||||
|   ControlMousePositionComponent, | ||||
|   ControlOverviewMapComponent, | ||||
|   ControlRotateComponent, | ||||
|   ControlScaleLineComponent, | ||||
|   ControlZoomComponent, | ||||
|   ControlZoomSliderComponent, | ||||
|   ControlZoomToExtentComponent, | ||||
|   FormatMVTComponent, | ||||
|   TileGridComponent, | ||||
|   TileGridWMTSComponent, | ||||
|   DefaultInteractionComponent, | ||||
|   DoubleClickZoomInteractionComponent, | ||||
|   DragAndDropInteractionComponent, | ||||
|   DragBoxInteractionComponent, | ||||
|   DragPanInteractionComponent, | ||||
|   DragRotateInteractionComponent, | ||||
|   DragRotateAndZoomInteractionComponent, | ||||
|   DragZoomInteractionComponent, | ||||
|   MouseWheelZoomInteractionComponent, | ||||
|   PinchZoomInteractionComponent, | ||||
|   DrawInteractionComponent, | ||||
|   KeyboardPanInteractionComponent, | ||||
|   KeyboardZoomInteractionComponent, | ||||
|   SelectInteractionComponent, | ||||
|   ModifyInteractionComponent, | ||||
|   TranslateInteractionComponent, | ||||
|   OverlayComponent, | ||||
|   ContentComponent, | ||||
|   AttributionsComponent, | ||||
|   AttributionComponent, | ||||
| }; | ||||
|  | ||||
| const COMPONENTS = [ | ||||
|   MapComponent, | ||||
|  | ||||
|   ViewComponent, | ||||
|   GraticuleComponent, | ||||
|  | ||||
|   LayerGroupComponent, | ||||
|   LayerImageComponent, | ||||
|   LayerTileComponent, | ||||
|   LayerVectorComponent, | ||||
|   LayerVectorTileComponent, | ||||
|  | ||||
|   SourceOsmComponent, | ||||
|   SourceBingmapsComponent, | ||||
|   SourceClusterComponent, | ||||
|   SourceUTFGridComponent, | ||||
|   SourceVectorComponent, | ||||
|   SourceXYZComponent, | ||||
|   SourceVectorTileComponent, | ||||
|   SourceTileWMSComponent, | ||||
|   SourceTileWMTSComponent, | ||||
|   SourceTileJSONComponent, | ||||
|   SourceGeoJSONComponent, | ||||
|   SourceImageStaticComponent, | ||||
|   SourceImageWMSComponent, | ||||
|   SourceImageArcGISRestComponent, | ||||
|   SourceRasterComponent, | ||||
|  | ||||
|   FeatureComponent, | ||||
|   GeometryLinestringComponent, | ||||
|   GeometryMultiLinestringComponent, | ||||
|   GeometryMultiPointComponent, | ||||
|   GeometryMultiPolygonComponent, | ||||
|   GeometryPointComponent, | ||||
|   GeometryPolygonComponent, | ||||
|   GeometryCircleComponent, | ||||
|   CoordinateComponent, | ||||
|   CollectionCoordinatesComponent, | ||||
|  | ||||
|   StyleComponent, | ||||
|   StyleCircleComponent, | ||||
|   StyleFillComponent, | ||||
|   StyleIconComponent, | ||||
|   StyleStrokeComponent, | ||||
|   StyleTextComponent, | ||||
|  | ||||
|   DefaultControlComponent, | ||||
|   ControlComponent, | ||||
|   ControlAttributionComponent, | ||||
|   ControlFullScreenComponent, | ||||
|   ControlMousePositionComponent, | ||||
|   ControlOverviewMapComponent, | ||||
|   ControlRotateComponent, | ||||
|   ControlScaleLineComponent, | ||||
|   ControlZoomComponent, | ||||
|   ControlZoomSliderComponent, | ||||
|   ControlZoomToExtentComponent, | ||||
|  | ||||
|   FormatMVTComponent, | ||||
|   TileGridComponent, | ||||
|   TileGridWMTSComponent, | ||||
|  | ||||
|   DefaultInteractionComponent, | ||||
|   DoubleClickZoomInteractionComponent, | ||||
|   DragAndDropInteractionComponent, | ||||
|   DragBoxInteractionComponent, | ||||
|   DragPanInteractionComponent, | ||||
|   DragRotateInteractionComponent, | ||||
|   DragRotateAndZoomInteractionComponent, | ||||
|   DragZoomInteractionComponent, | ||||
|   MouseWheelZoomInteractionComponent, | ||||
|   PinchZoomInteractionComponent, | ||||
|   DrawInteractionComponent, | ||||
|   SelectInteractionComponent, | ||||
|   ModifyInteractionComponent, | ||||
|   TranslateInteractionComponent, | ||||
|  | ||||
|   OverlayComponent, | ||||
|   ContentComponent, | ||||
|   AttributionsComponent, | ||||
|   AttributionComponent, | ||||
| ]; | ||||
|  | ||||
| @NgModule({ | ||||
|   declarations: COMPONENTS, | ||||
|   imports: [CommonModule], | ||||
|   exports: COMPONENTS, | ||||
| }) | ||||
| export class AngularOpenlayersModule {} | ||||
| @@ -1,12 +0,0 @@ | ||||
| // This file is required by karma.conf.js and loads recursively all the .spec and framework files | ||||
|  | ||||
| import 'core-js/es7/reflect'; | ||||
| import 'zone.js'; | ||||
| import 'zone.js/testing'; | ||||
| import { getTestBed } from '@angular/core/testing'; | ||||
| import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from '@angular/platform-browser-dynamic/testing'; | ||||
|  | ||||
| // First, initialize the Angular testing environment. | ||||
| getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting(), { | ||||
|   teardown: { destroyAfterEach: false }, | ||||
| }); | ||||
| @@ -1,27 +0,0 @@ | ||||
| { | ||||
|   "extends": "../../tsconfig.base.json", | ||||
|   "compilerOptions": { | ||||
|     "outDir": "../../dist/out-tsc", | ||||
|     "declaration": true, | ||||
|     "declarationMap": true, | ||||
|     "inlineSources": true, | ||||
|     "types": [], | ||||
|     "lib": [ | ||||
|       "dom", | ||||
|       "es2018" | ||||
|     ] | ||||
|   }, | ||||
|   "angularCompilerOptions": { | ||||
|     "skipLibCheck": true, | ||||
|     "skipTemplateCodegen": true, | ||||
|     "strictMetadataEmit": true, | ||||
|     "enableResourceInlining": true | ||||
|   }, | ||||
|   "exclude": [ | ||||
|     "src/test.ts", | ||||
|     "**/*.spec.ts" | ||||
|   ], | ||||
|   "include": [ | ||||
|     "**/*.ts" | ||||
|   ] | ||||
| } | ||||
| @@ -1,9 +0,0 @@ | ||||
| { | ||||
|   "extends": "./tsconfig.lib.json", | ||||
|   "compilerOptions": { | ||||
|     "declarationMap": false | ||||
|   }, | ||||
|   "angularCompilerOptions": { | ||||
|     "compilationMode": "partial" | ||||
|   } | ||||
| } | ||||
| @@ -1,17 +0,0 @@ | ||||
| { | ||||
|   "extends": "../../tsconfig.base.json", | ||||
|   "compilerOptions": { | ||||
|     "outDir": "../../dist/out-tsc", | ||||
|     "types": [ | ||||
|       "jasmine", | ||||
|       "node" | ||||
|     ] | ||||
|   }, | ||||
|   "files": [ | ||||
|     "src/test.ts" | ||||
|   ], | ||||
|   "include": [ | ||||
|     "**/*.spec.ts", | ||||
|     "**/*.d.ts" | ||||
|   ] | ||||
| } | ||||
| @@ -1,7 +0,0 @@ | ||||
| { | ||||
|   "extends": [ | ||||
|     "./tslint.json", | ||||
|     "tslint-config-prettier", | ||||
|     "tslint-plugin-prettier" | ||||
|   ] | ||||
| } | ||||
		Reference in New Issue
	
	Block a user