AW-6046 ng-openlayers

This commit is contained in:
Peter (extern) 2024-04-10 14:06:44 +02:00
parent 9c270bfe75
commit 4384b12944
100 changed files with 43 additions and 4228 deletions

View File

@ -253,43 +253,6 @@
}
}
}
},
"ng-openlayers": {
"projectType": "library",
"root": "projects/ng-openlayers",
"sourceRoot": "projects/ng-openlayers/src",
"prefix": "lib",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:ng-packagr",
"options": {
"tsConfig": "projects/ng-openlayers/tsconfig.lib.json",
"project": "projects/ng-openlayers/ng-package.json"
},
"configurations": {
"production": {
"tsConfig": "projects/ng-openlayers/tsconfig.lib.prod.json"
}
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "projects/ng-openlayers/src/test.ts",
"tsConfig": "projects/ng-openlayers/tsconfig.spec.json",
"karmaConfig": "projects/ng-openlayers/karma.conf.js"
}
},
"lint": {
"builder": "@angular-eslint/builder:lint",
"options": {
"lintFilePatterns": [
"projects/ng-openlayers/**/*.ts",
"projects/ng-openlayers/**/*.html"
]
}
}
}
}
},
"cli": {

63
package-lock.json generated
View File

@ -35,10 +35,10 @@
"core-js": "^2.6.12",
"https-browserify": "^1.0.0",
"moment": "^2.29.4",
"ng-openlayers": "file:dist/ng-openlayers",
"ng-openlayers": "17.1.3",
"ngrx-store-localstorage": "17.0.0",
"ngx-avatars": "1.7.0",
"ngx-clipboard": "^15.1.0",
"ngx-clipboard": "16.0.0",
"ngx-image-cropper": "^7.2.1",
"ngx-uploadx": "^6.2.0",
"ol": "^8.2.0",
@ -86,7 +86,7 @@
},
"dist/common": {
"name": "@farmmaps/common",
"version": "4.5.0-prerelease.2458",
"version": "2.0.0",
"dependencies": {
"tslib": "^2.3.0"
},
@ -94,7 +94,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.6",
"@ng-bootstrap/ng-bootstrap": "^16.0.0",
"@ngrx/effects": "^17",
"@ngrx/router-store": "^17",
@ -103,15 +103,15 @@
"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": "^15.1.0",
"ngx-image-cropper": "^7.2.1",
"ngx-uploadx": "^6.2.0",
"tassign": ">1.0.0"
"tassign": "^1.0.0"
}
},
"dist/common-map": {
"name": "@farmmaps/common-map",
"version": "4.5.0-prerelease.2458",
"version": "2.0.0",
"dependencies": {
"tslib": "^2.0.0"
},
@ -128,7 +128,7 @@
},
"dist/common-map3d": {
"name": "@farmmaps/common-map3d",
"version": "4.5.0-prerelease.2458",
"version": "2.0.0",
"dependencies": {
"tslib": "^2.0.0"
},
@ -140,18 +140,6 @@
"ol-cesium": ">=2.13.0"
}
},
"dist/ng-openlayers": {
"version": "4.5.0-prerelease.2458",
"license": "MPL-2.0",
"dependencies": {
"tslib": "^2.3.0"
},
"peerDependencies": {
"@angular/common": ">=17.0.0",
"@angular/core": ">=17.0.0",
"ol": "^8.2.0"
}
},
"dist/ngx-openlayers": {
"version": "2.0.0",
"extraneous": true,
@ -12407,8 +12395,17 @@
"dev": true
},
"node_modules/ng-openlayers": {
"resolved": "dist/ng-openlayers",
"link": true
"version": "17.1.3",
"resolved": "https://registry.npmjs.org/ng-openlayers/-/ng-openlayers-17.1.3.tgz",
"integrity": "sha512-03FmNUhxF2431BmHvM80Fmo2AodsQeQE4zMcsNHnLOb3taDtmthmLFFG1TY6n03ZiZv2Xddp7fm6nXPeYt2jCg==",
"dependencies": {
"tslib": "^2.3.0"
},
"peerDependencies": {
"@angular/common": ">=17.0.0",
"@angular/core": ">=17.0.0",
"ol": "^8.2.0"
}
},
"node_modules/ng-packagr": {
"version": "17.3.0",
@ -12526,11 +12523,11 @@
}
},
"node_modules/ngx-clipboard": {
"version": "15.1.0",
"resolved": "https://registry.npmjs.org/ngx-clipboard/-/ngx-clipboard-15.1.0.tgz",
"integrity": "sha512-dUJl1cNtdkCqL953oAhP7wmUPFrqW2aDg5OPhwPU9R3cLEdQgU2NbsHEUz4zaPyEopTXu8SR37onVm1Ep8qOHg==",
"version": "16.0.0",
"resolved": "https://registry.npmjs.org/ngx-clipboard/-/ngx-clipboard-16.0.0.tgz",
"integrity": "sha512-rZ/Eo1PqiKMiyF8tdjhmUkoUu68f7OzBJ7YH1YFeh2RAaNrerTaW8XfFOzppSckjFQqA1fwGSYuTTJlDhDag5w==",
"dependencies": {
"ngx-window-token": ">=6.0.0",
"ngx-window-token": ">=7.0.0",
"tslib": "^2.0.0"
},
"peerDependencies": {
@ -26570,7 +26567,9 @@
"dev": true
},
"ng-openlayers": {
"version": "file:dist/ng-openlayers",
"version": "17.1.3",
"resolved": "https://registry.npmjs.org/ng-openlayers/-/ng-openlayers-17.1.3.tgz",
"integrity": "sha512-03FmNUhxF2431BmHvM80Fmo2AodsQeQE4zMcsNHnLOb3taDtmthmLFFG1TY6n03ZiZv2Xddp7fm6nXPeYt2jCg==",
"requires": {
"tslib": "^2.3.0"
}
@ -26658,11 +26657,11 @@
}
},
"ngx-clipboard": {
"version": "15.1.0",
"resolved": "https://registry.npmjs.org/ngx-clipboard/-/ngx-clipboard-15.1.0.tgz",
"integrity": "sha512-dUJl1cNtdkCqL953oAhP7wmUPFrqW2aDg5OPhwPU9R3cLEdQgU2NbsHEUz4zaPyEopTXu8SR37onVm1Ep8qOHg==",
"version": "16.0.0",
"resolved": "https://registry.npmjs.org/ngx-clipboard/-/ngx-clipboard-16.0.0.tgz",
"integrity": "sha512-rZ/Eo1PqiKMiyF8tdjhmUkoUu68f7OzBJ7YH1YFeh2RAaNrerTaW8XfFOzppSckjFQqA1fwGSYuTTJlDhDag5w==",
"requires": {
"ngx-window-token": ">=6.0.0",
"ngx-window-token": ">=7.0.0",
"tslib": "^2.0.0"
}
},

View File

@ -23,7 +23,7 @@
"@farmmaps/common": "file:dist/common",
"@farmmaps/common-map": "file:dist/common-map",
"@farmmaps/common-map3d": "file:dist/common-map3d",
"ng-openlayers": "file:dist/ng-openlayers",
"ng-openlayers": "17.1.3",
"@microsoft/signalr": "^3.1.16",
"@ng-bootstrap/ng-bootstrap": "^16.0.0",
"@ngrx/effects": "^17",

View File

@ -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": {

View File

@ -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"
}
}

View File

@ -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"
}
},

View File

@ -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"
},

View File

@ -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"
}
}
}

View File

@ -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": {}
}
]
}

View File

@ -1,2 +0,0 @@
/node_modules

View File

@ -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,
});
};

View File

@ -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"
}
}

View File

@ -1,3 +0,0 @@
module.exports = {
ignorableDeepImportMatchers: [/ol\//],
};

View File

@ -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=="
}
}
}

View File

@ -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"
}
}

View File

@ -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"
]
}
}
}
}

View File

@ -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;
}
}

View File

@ -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);
}
}
}

View File

@ -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);
}
}

View File

@ -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) {}
}

View File

@ -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);
}
}

View File

@ -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);
}
}
}

View File

@ -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));
}
}

View File

@ -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);
}
}

View File

@ -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);
}
}

View File

@ -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);
}
}

View File

@ -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);
}
}

View File

@ -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);
}
}

View File

@ -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);
}
}

View File

@ -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);
}
}

View File

@ -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);
}
}

View File

@ -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;
}
}
}

View File

@ -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);
}
}
}

View File

@ -1,6 +0,0 @@
import Feature from 'ol/format/Feature';
export class FormatComponent {
public instance: Feature;
public componentType = 'format';
}

View File

@ -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);
}
}

View File

@ -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]);
}
}

View File

@ -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();
}
}

View File

@ -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();
}
}

View File

@ -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();
}
}