Compare commits
No commits in common. "d36185dbbf08244be777ef6815a2d90c87218af7" and "5cbb6f32f96d8598b14e986b2f785f4159af7b0e" have entirely different histories.
d36185dbbf
...
5cbb6f32f9
1
.gitignore
vendored
1
.gitignore
vendored
@ -51,5 +51,4 @@ projects/common-map/node_modules/
|
||||
.angular/*
|
||||
projects/common-map3d/node_modules/
|
||||
projects/common-map/node_modules/
|
||||
projects/common-aol/node_modules/
|
||||
projects/common/node_modules/
|
||||
|
||||
28
angular.json
28
angular.json
@ -253,34 +253,6 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"common-aol": {
|
||||
"projectType": "library",
|
||||
"root": "projects/common-aol",
|
||||
"sourceRoot": "projects/common-aol/src",
|
||||
"prefix": "fm-aol",
|
||||
"architect": {
|
||||
"build": {
|
||||
"builder": "@angular-devkit/build-angular:ng-packagr:build",
|
||||
"options": {
|
||||
"tsConfig": "projects/common-aol/tsconfig.lib.json",
|
||||
"project": "projects/common-aol/ng-package.json"
|
||||
},
|
||||
"configurations": {
|
||||
"production": {
|
||||
"tsConfig": "projects/common-aol/tsconfig.lib.prod.json"
|
||||
}
|
||||
}
|
||||
},
|
||||
"test": {
|
||||
"builder": "@angular-devkit/build-angular:karma",
|
||||
"options": {
|
||||
"main": "projects/common-aol/src/test.ts",
|
||||
"tsConfig": "projects/common-aol/tsconfig.spec.json",
|
||||
"karmaConfig": "projects/common-aol/karma.conf.js"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"cli": {
|
||||
|
||||
19451
package-lock.json
generated
19451
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
53
package.json
53
package.json
@ -11,23 +11,22 @@
|
||||
},
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"@angular/animations": "^14.1.3",
|
||||
"@angular/common": "^14.1.3",
|
||||
"@angular/compiler": "^14.1.3",
|
||||
"@angular/core": "^14.1.3",
|
||||
"@angular-eslint/eslint-plugin": "^15.2.1",
|
||||
"@angular/animations": "^16.2.12",
|
||||
"@angular/common": "^16.2.12",
|
||||
"@angular/compiler": "^16.2.12",
|
||||
"@angular/core": "^16.2.12",
|
||||
"@angular/forms": "^16.2.12",
|
||||
"@angular/platform-browser": "^16.2.12",
|
||||
"@angular/platform-browser-dynamic": "^16.2.12",
|
||||
"@angular/router": "^16.2.12",
|
||||
"@angular/forms": "^14.1.3",
|
||||
"@angular/platform-browser": "^14.1.3",
|
||||
"@angular/platform-browser-dynamic": "^14.1.3",
|
||||
"@angular/router": "^14.1.3",
|
||||
"@farmmaps/common": "file:dist/common",
|
||||
"@farmmaps/common-aol": "file:dist/common-aol",
|
||||
"@farmmaps/common-map": "file:dist/common-map",
|
||||
"@farmmaps/common-map3d": "file:dist/common-map3d",
|
||||
"@microsoft/signalr": "^8.0.0",
|
||||
"@ng-bootstrap/ng-bootstrap": "^15.0.0",
|
||||
"@ngrx/effects": "^15",
|
||||
"@ngrx/router-store": "^15",
|
||||
"@microsoft/signalr": "^3.1.16",
|
||||
"@ng-bootstrap/ng-bootstrap": "^13.0.0",
|
||||
"@ngrx/effects": "^14",
|
||||
"@ngrx/router-store": "^14",
|
||||
"@ngrx/store": "^14",
|
||||
"@popperjs/core": "^2.11.6",
|
||||
"angular-oauth2-oidc": "^13",
|
||||
@ -40,9 +39,10 @@
|
||||
"https-browserify": "^1.0.0",
|
||||
"moment": "^2.29.4",
|
||||
"ngrx-store-localstorage": "^14",
|
||||
"ngx-avatars": "^1.7.0",
|
||||
"ngx-clipboard": "^15.1.0",
|
||||
"ngx-image-cropper": "^6.0.2",
|
||||
"ngx-avatar": "^4.1.0",
|
||||
"ngx-clipboard": "^14.0.1",
|
||||
"ngx-image-cropper": "^3.3.5",
|
||||
"ngx-openlayers": "1.0.0-next.19",
|
||||
"ngx-uploadx": "^5.2.0",
|
||||
"ol": "6.14.1",
|
||||
"olcs": "^2.13.1",
|
||||
@ -54,15 +54,15 @@
|
||||
"tslib": "^2.4.0",
|
||||
"url": "^0.11.0",
|
||||
"util": "^0.12.4",
|
||||
"zone.js": "~0.13.3"
|
||||
"zone.js": "~0.11.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@angular-builders/custom-webpack": "^16.0.1",
|
||||
"@angular-devkit/build-angular": "^16.2.11",
|
||||
"@angular/cli": "^16.2.11",
|
||||
"@angular/compiler-cli": "^16.2.12",
|
||||
"@angular/language-service": "^16.2.12",
|
||||
"@angular/localize": "^16.2.12",
|
||||
"@angular-builders/custom-webpack": "^14",
|
||||
"@angular-devkit/build-angular": "^14.1.3",
|
||||
"@angular/cli": "^14.1.3",
|
||||
"@angular/compiler-cli": "^14.1.3",
|
||||
"@angular/language-service": "^14.1.3",
|
||||
"@angular/localize": "^14.1.3",
|
||||
"@types/arcgis-rest-api": "^10.4.5",
|
||||
"@types/jasmine": "~2.8.8",
|
||||
"@types/jasminewd2": "^2.0.9",
|
||||
@ -70,6 +70,7 @@
|
||||
"@typescript-eslint/eslint-plugin": "^5.54.0",
|
||||
"@typescript-eslint/eslint-plugin-tslint": "^5.54.0",
|
||||
"@typescript-eslint/parser": "^5.54.0",
|
||||
"codelyzer": "^0.0.28",
|
||||
"eslint": "^8.35.0",
|
||||
"eslint-config-prettier": "^8.6.0",
|
||||
"eslint-plugin-import": "^2.27.5",
|
||||
@ -80,9 +81,9 @@
|
||||
"karma-coverage-istanbul-reporter": "^3.0.3",
|
||||
"karma-jasmine": "^5.1.0",
|
||||
"karma-jasmine-html-reporter": "^2.0.0",
|
||||
"ng-packagr": "^16.2.3",
|
||||
"protractor": "^7.0.0",
|
||||
"ng-packagr": "^14.1.0",
|
||||
"protractor": "~7.0.0",
|
||||
"ts-node": "^8.8.1",
|
||||
"typescript": "~5.1.6"
|
||||
"typescript": "~4.6.4"
|
||||
}
|
||||
}
|
||||
@ -1,22 +0,0 @@
|
||||
module.exports = {
|
||||
"env": {
|
||||
"browser": true,
|
||||
"es2021": true
|
||||
},
|
||||
"extends": [
|
||||
"eslint:recommended",
|
||||
"plugin:@typescript-eslint/recommended"
|
||||
],
|
||||
"overrides": [
|
||||
],
|
||||
"parser": "@typescript-eslint/parser",
|
||||
"parserOptions": {
|
||||
"ecmaVersion": "latest",
|
||||
"sourceType": "module"
|
||||
},
|
||||
"plugins": [
|
||||
"@typescript-eslint"
|
||||
],
|
||||
"rules": {
|
||||
}
|
||||
}
|
||||
@ -1,24 +0,0 @@
|
||||
# CommonAol
|
||||
|
||||
This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 7.2.0.
|
||||
|
||||
## Code scaffolding
|
||||
|
||||
Run `ng generate component component-name --project common-aol` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project common-aol`.
|
||||
> Note: Don't forget to add `--project common-aol` or else it will be added to the default project in your `angular.json` file.
|
||||
|
||||
## Build
|
||||
|
||||
Run `ng build common-aol` to build the project. The build artifacts will be stored in the `dist/` directory.
|
||||
|
||||
## Publishing
|
||||
|
||||
After building your library with `ng build common-aol`, go to the dist folder `cd dist/common-aol` and run `npm publish`.
|
||||
|
||||
## Running unit tests
|
||||
|
||||
Run `ng test common-aol` to execute the unit tests via [Karma](https://karma-runner.github.io).
|
||||
|
||||
## Further help
|
||||
|
||||
To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md).
|
||||
@ -1,10 +0,0 @@
|
||||
{
|
||||
"$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
|
||||
"dest": "../../dist/common-aol",
|
||||
"lib": {
|
||||
"entryFile": "src/public-api.ts"
|
||||
},
|
||||
"allowedNonPeerDependencies": [
|
||||
"."
|
||||
]
|
||||
}
|
||||
2548
projects/common-aol/package-lock.json
generated
2548
projects/common-aol/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -1,21 +0,0 @@
|
||||
{
|
||||
"name": "@farmmaps/common-aol",
|
||||
"version": "2.1.0",
|
||||
"publishConfig": {
|
||||
"registry": "https://repository.akkerweb.nl/repository/npm-hosted/"
|
||||
},
|
||||
"dependencies": {
|
||||
"tslib": "^2.0.0",
|
||||
"@types/openlayers": "4.3.x || 4.4.x",
|
||||
"openlayers": "4.3.x || 4.4.x"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@angular/core": ">=16.0.0",
|
||||
"ngrx-store-localstorage": ">=16.0.0",
|
||||
"@ngrx/effects": ">=16.0.0",
|
||||
"@ngrx/router-store":">=16.0.0",
|
||||
"@ngrx/store":">=16.0.0",
|
||||
"tassign": ">=1.0.0",
|
||||
"ol": ">=6.8.1"
|
||||
}
|
||||
}
|
||||
@ -1,114 +0,0 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import {
|
||||
MapComponent, ViewComponent, GraticuleComponent,
|
||||
LayerGroupComponent, LayerTileComponent, LayerVectorComponent, LayerVectorTileComponent, LayerImageComponent,
|
||||
SourceClusterComponent, SourceRasterComponent,
|
||||
SourceBingmapsComponent, SourceOsmComponent, SourceVectorComponent, SourceVectorTileComponent, SourceXYZComponent, SourceTileUTFGridComponent, SourceTileWMSComponent,
|
||||
SourceGeoJSONComponent, SourceTileWMTSComponent, SourceTileJSONComponent, SourceImageStaticComponent, SourceImageWMSComponent, FeatureComponent,
|
||||
GeometryLinestringComponent, GeometryPointComponent, GeometryPolygonComponent,
|
||||
CollectionCoordinatesComponent, CoordinateComponent,
|
||||
StyleCircleComponent, StyleComponent, StyleFillComponent, StyleIconComponent, StyleStrokeComponent, StyleTextComponent,
|
||||
ControlAttributionComponent, ControlMousePositionComponent,
|
||||
// ControlFullScreenComponent, ControlRotateComponent, ControlZoomSliderComponent,
|
||||
ControlOverviewMapComponent, ControlScaleLineComponent, ControlZoomComponent,
|
||||
ControlZoomToExtentComponent, DefaultControlComponent, ControlComponent,
|
||||
FormatMVTComponent,
|
||||
TileGridComponent, TileGridWMTSComponent,
|
||||
DefaultInteractionComponent, DragRotateInteractionComponent, DragRotateAndZoomInteractionComponent,
|
||||
DoubleClickZoomInteractionComponent, DragAndDropInteractionComponent, DragBoxInteractionComponent,
|
||||
DragPanInteractionComponent, DragZoomInteractionComponent, MouseWheelZoomInteractionComponent,
|
||||
PinchZoomInteractionComponent, DrawInteractionComponent, SelectInteractionComponent, ModifyInteractionComponent, TranslateInteractionComponent,
|
||||
OverlayComponent,
|
||||
ContentComponent,
|
||||
AttributionComponent,
|
||||
AttributionsComponent
|
||||
} from './components';
|
||||
|
||||
export * from './components';
|
||||
|
||||
const COMPONENTS = [
|
||||
MapComponent,
|
||||
|
||||
ViewComponent,
|
||||
GraticuleComponent,
|
||||
|
||||
LayerGroupComponent,
|
||||
LayerImageComponent,
|
||||
LayerTileComponent,
|
||||
LayerVectorComponent,
|
||||
LayerVectorTileComponent,
|
||||
|
||||
SourceClusterComponent,
|
||||
SourceRasterComponent,
|
||||
SourceOsmComponent,
|
||||
SourceBingmapsComponent,
|
||||
SourceVectorComponent,
|
||||
SourceXYZComponent,
|
||||
SourceVectorTileComponent,
|
||||
SourceTileUTFGridComponent,
|
||||
SourceTileWMSComponent,
|
||||
SourceTileWMTSComponent,
|
||||
SourceTileJSONComponent,
|
||||
SourceGeoJSONComponent,
|
||||
SourceImageStaticComponent,
|
||||
SourceImageWMSComponent,
|
||||
FeatureComponent,
|
||||
GeometryLinestringComponent,
|
||||
GeometryPointComponent,
|
||||
GeometryPolygonComponent,
|
||||
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,
|
||||
AttributionComponent,
|
||||
AttributionsComponent
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
declarations: COMPONENTS,
|
||||
imports: [CommonModule],
|
||||
exports: COMPONENTS
|
||||
})
|
||||
|
||||
export class AppCommonAolModule {
|
||||
}
|
||||
@ -1,21 +0,0 @@
|
||||
import { Component, ElementRef, OnInit } from '@angular/core';
|
||||
import { Attribution } from 'openlayers';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-attribution',
|
||||
template: '<ng-content></ng-content>'
|
||||
})
|
||||
export class AttributionComponent implements OnInit {
|
||||
instance: Attribution;
|
||||
html: string;
|
||||
|
||||
constructor(
|
||||
private elementRef: ElementRef
|
||||
) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.html = this.elementRef.nativeElement.innerHTML;
|
||||
this.instance = new Attribution(this);
|
||||
}
|
||||
}
|
||||
@ -1,26 +0,0 @@
|
||||
import { AfterViewInit, Component, ContentChildren, Host, QueryList } from '@angular/core';
|
||||
import { Attribution } from 'openlayers';
|
||||
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 {
|
||||
instance: Array<Attribution>;
|
||||
|
||||
@ContentChildren(AttributionComponent) attributions: QueryList<AttributionComponent>;
|
||||
|
||||
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.instance);
|
||||
// console.log('setting attributions:', this.instance);
|
||||
this.source.instance.setAttributions(this.instance);
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,13 +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,32 +0,0 @@
|
||||
import { Component, ElementRef, Input, OnDestroy, OnInit } from '@angular/core';
|
||||
import { control } from 'openlayers';
|
||||
import { MapComponent } from '../map.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-control-attribution',
|
||||
template: ``
|
||||
})
|
||||
export class ControlAttributionComponent implements OnInit, OnDestroy {
|
||||
public componentType: string = 'control';
|
||||
instance: control.Attribution;
|
||||
target: Element;
|
||||
@Input() collapsible: boolean;
|
||||
|
||||
constructor(
|
||||
private map: MapComponent,
|
||||
private element: ElementRef
|
||||
) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.target = this.element.nativeElement;
|
||||
// console.log('ol.control.Attribution init: ', this);
|
||||
this.instance = new control.Attribution(this);
|
||||
this.map.instance.addControl(this.instance);
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
// console.log('removing aol-control-attribution');
|
||||
this.map.instance.removeControl(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,34 +0,0 @@
|
||||
import { Component, ContentChild, OnDestroy, OnInit } from '@angular/core';
|
||||
import { control } from 'openlayers';
|
||||
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 {
|
||||
public componentType: string = 'control';
|
||||
instance: control.Control;
|
||||
element: Element;
|
||||
@ContentChild(ContentComponent) content: ContentComponent;
|
||||
|
||||
constructor(
|
||||
private map: MapComponent
|
||||
) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
if (this.content) {
|
||||
this.element = this.content.elementRef.nativeElement;
|
||||
this.instance = new control.Control(this);
|
||||
this.map.instance.addControl(this.instance);
|
||||
}
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
if (this.instance) {
|
||||
this.map.instance.removeControl(this.instance);
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,31 +0,0 @@
|
||||
import { Component, OnDestroy, OnInit, Input } from '@angular/core';
|
||||
import { control, Collection } from 'openlayers';
|
||||
import { MapComponent } from '../map.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-control-defaults',
|
||||
template: ''
|
||||
})
|
||||
export class DefaultControlComponent implements OnInit, OnDestroy {
|
||||
instance: Collection<control.Control>;
|
||||
@Input() attribution: boolean;
|
||||
@Input() attributionOptions: olx.control.AttributionOptions;
|
||||
@Input() rotate: boolean;
|
||||
@Input() rotateOptions: olx.control.RotateOptions;
|
||||
@Input() zoom: boolean;
|
||||
@Input() zoomOptions: olx.control.ZoomOptions;
|
||||
|
||||
constructor(private map: MapComponent) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
// console.log('ol.control.defaults init: ', this);
|
||||
this.instance = control.defaults(this);
|
||||
this.instance.forEach((control) => this.map.instance.addControl(control));
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
// console.log('removing aol-control-defaults');
|
||||
this.instance.forEach((control) => this.map.instance.removeControl(control));
|
||||
}
|
||||
}
|
||||
@ -1,28 +0,0 @@
|
||||
// Commented-out due to error TS2345: Argument of type 'this' is not assignable to parameter of type 'FullScreenOptions'.
|
||||
|
||||
// import { Component, OnDestroy, OnInit } from '@angular/core';
|
||||
// import { control } from 'openlayers';
|
||||
// import { MapComponent } from '../map.component';
|
||||
|
||||
// @Component({
|
||||
// selector: 'aol-control-fullscreen',
|
||||
// template: `<ng-content></ng-content>`
|
||||
// })
|
||||
// export class ControlFullScreenComponent implements OnInit, OnDestroy {
|
||||
// instance: control.FullScreen;
|
||||
|
||||
// constructor(private map: MapComponent) {
|
||||
// // console.log('instancing aol-control-fullscreen');
|
||||
// }
|
||||
|
||||
// ngOnInit() {
|
||||
// this.instance = new control.FullScreen(this);
|
||||
// this.map.instance.addControl(this.instance);
|
||||
// }
|
||||
|
||||
|
||||
// ngOnDestroy() {
|
||||
// // console.log('removing aol-control-fullscreen');
|
||||
// this.map.instance.removeControl(this.instance);
|
||||
// }
|
||||
// }
|
||||
@ -1,11 +0,0 @@
|
||||
export * from './attribution.component';
|
||||
export * from './control.component';
|
||||
export * from './default.component';
|
||||
//export * from './fullscreen.component';
|
||||
export * from './mouseposition.component';
|
||||
export * from './overviewmap.component';
|
||||
//export * from './rotate.component';
|
||||
export * from './scaleline.component';
|
||||
export * from './zoom.component';
|
||||
//export * from './zoomslider.component';
|
||||
export * from './zoomtoextent.component';
|
||||
@ -1,32 +0,0 @@
|
||||
import { Component, ElementRef, Input, OnDestroy, OnInit } from '@angular/core';
|
||||
import { control, CoordinateFormatType, ProjectionLike } from 'openlayers';
|
||||
import { MapComponent } from '../map.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-control-mouseposition',
|
||||
template: ``
|
||||
})
|
||||
export class ControlMousePositionComponent implements OnInit, OnDestroy {
|
||||
instance: control.MousePosition;
|
||||
@Input() coordinateFormat: CoordinateFormatType;
|
||||
@Input() projection: ProjectionLike;
|
||||
target: Element;
|
||||
|
||||
constructor(
|
||||
private map: MapComponent,
|
||||
private element: ElementRef
|
||||
) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.target = this.element.nativeElement;
|
||||
// console.log('ol.control.MousePosition init: ', this);
|
||||
this.instance = new control.MousePosition(this);
|
||||
this.map.instance.addControl(this.instance);
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
// console.log('removing aol-control-mouseposition');
|
||||
this.map.instance.removeControl(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,33 +0,0 @@
|
||||
import { Component, Input, OnDestroy, OnInit } from '@angular/core';
|
||||
import { control, View, layer } from 'openlayers';
|
||||
import { MapComponent } from '../map.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-control-overviewmap',
|
||||
template: `<ng-content></ng-content>`
|
||||
})
|
||||
export class ControlOverviewMapComponent implements OnInit, OnDestroy {
|
||||
instance: control.OverviewMap;
|
||||
@Input() collapsed: boolean;
|
||||
@Input() collapseLabel: string;
|
||||
@Input() collapsible: boolean;
|
||||
@Input() label: string;
|
||||
@Input() layers: layer.Layer[];
|
||||
@Input() target: Element;
|
||||
@Input() tipLabel: string;
|
||||
@Input() view: View;
|
||||
|
||||
constructor(private map: MapComponent) {
|
||||
// console.log('instancing aol-control-overviewmap');
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new control.OverviewMap(this);
|
||||
this.map.instance.addControl(this.instance);
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
// console.log('removing aol-control-overviewmap');
|
||||
this.map.instance.removeControl(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,27 +0,0 @@
|
||||
// Commented-out due to error TS2345: Argument of type 'this' is not assignable to parameter of type 'RotateOptions'.
|
||||
|
||||
// import { Component, OnDestroy, OnInit } from '@angular/core';
|
||||
// import { control } from 'openlayers';
|
||||
// import { MapComponent } from '../map.component';
|
||||
|
||||
// @Component({
|
||||
// selector: 'aol-control-rotate',
|
||||
// template: `<ng-content></ng-content>`
|
||||
// })
|
||||
// export class ControlRotateComponent implements OnInit, OnDestroy {
|
||||
// instance: control.Rotate;
|
||||
|
||||
// constructor(private map: MapComponent) {
|
||||
// // console.log('instancing aol-control-rotate');
|
||||
// }
|
||||
|
||||
// ngOnInit() {
|
||||
// this.instance = new control.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 { control } from 'openlayers';
|
||||
import { MapComponent } from '../map.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-control-scaleline',
|
||||
template: `<ng-content></ng-content>`
|
||||
})
|
||||
export class ControlScaleLineComponent implements OnInit, OnDestroy {
|
||||
instance: control.ScaleLine;
|
||||
@Input() units: string;
|
||||
|
||||
constructor(private map: MapComponent) {
|
||||
// console.log('instancing aol-control-scaleline');
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new control.ScaleLine(this);
|
||||
this.map.instance.addControl(this.instance);
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
// console.log('removing aol-control-scaleline');
|
||||
this.map.instance.removeControl(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,32 +0,0 @@
|
||||
import { Component, Input, OnDestroy, OnInit } from '@angular/core';
|
||||
import { control } from 'openlayers';
|
||||
import { MapComponent } from '../map.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-control-zoom',
|
||||
template: `<ng-content></ng-content>`
|
||||
})
|
||||
export class ControlZoomComponent implements OnInit, OnDestroy {
|
||||
instance: control.Zoom;
|
||||
|
||||
@Input() duration: number;
|
||||
@Input() zoomInLabel: (string | Node);
|
||||
@Input() zoomOutLabel: (string | Node);
|
||||
@Input() zoomInTipLabel: string;
|
||||
@Input() zoomOutTipLabel: string;
|
||||
@Input() delta: number;
|
||||
|
||||
constructor(private map: MapComponent) {
|
||||
// console.log('instancing aol-control-zoom');
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new control.Zoom(this);
|
||||
this.map.instance.addControl(this.instance);
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
// console.log('removing aol-control-zoom');
|
||||
this.map.instance.removeControl(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,27 +0,0 @@
|
||||
// Commented-out due to error TS2345: Argument of type 'this' is not assignable to parameter of type 'ZoomSliderOptions'.
|
||||
|
||||
// import { Component, OnDestroy, OnInit } from '@angular/core';
|
||||
// import { control } from 'openlayers';
|
||||
// import { MapComponent } from '../map.component';
|
||||
|
||||
// @Component({
|
||||
// selector: 'aol-control-zoomslider',
|
||||
// template: `<ng-content></ng-content>`
|
||||
// })
|
||||
// export class ControlZoomSliderComponent implements OnInit, OnDestroy {
|
||||
// instance: control.ZoomSlider;
|
||||
|
||||
// constructor(private map: MapComponent) {
|
||||
// // console.log('instancing aol-control-zoomslider');
|
||||
// }
|
||||
|
||||
// ngOnInit() {
|
||||
// this.instance = new control.ZoomSlider(this);
|
||||
// this.map.instance.addControl(this.instance);
|
||||
// }
|
||||
|
||||
// ngOnDestroy() {
|
||||
// // console.log('removing aol-control-zoomslider');
|
||||
// this.map.instance.removeControl(this.instance);
|
||||
// }
|
||||
// }
|
||||
@ -1,30 +0,0 @@
|
||||
import { Component, Input, OnDestroy, OnInit } from '@angular/core';
|
||||
import { control, Extent } from 'openlayers';
|
||||
import { MapComponent } from '../map.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-control-zoomtoextent',
|
||||
template: `<ng-content></ng-content>`
|
||||
})
|
||||
export class ControlZoomToExtentComponent implements OnInit, OnDestroy {
|
||||
instance: control.ZoomToExtent;
|
||||
|
||||
@Input() className: string;
|
||||
@Input() label: (string | Node);
|
||||
@Input() tipLabel: string;
|
||||
@Input() extent: Extent;
|
||||
|
||||
constructor(private map: MapComponent) {
|
||||
// console.log('instancing aol-control-zoomtoextent');
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new control.ZoomToExtent(this);
|
||||
this.map.instance.addControl(this.instance);
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
// console.log('removing aol-control-zoomtoextent');
|
||||
this.map.instance.removeControl(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,118 +0,0 @@
|
||||
import { Component, Optional, OnChanges, Input, SimpleChanges } from '@angular/core';
|
||||
import { proj, Coordinate } from 'openlayers';
|
||||
import { MapComponent } from './map.component';
|
||||
import { GeometryPointComponent, GeometryLinestringComponent, GeometryPolygonComponent } from './geometry.components';
|
||||
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 {
|
||||
private host: any;
|
||||
|
||||
@Input() x: number;
|
||||
@Input() y: number;
|
||||
@Input() srid: string = 'EPSG:3857';
|
||||
|
||||
constructor(
|
||||
private map: MapComponent,
|
||||
@Optional() viewHost: ViewComponent,
|
||||
@Optional() geometryPointHost: GeometryPointComponent,
|
||||
@Optional() overlayHost: OverlayComponent
|
||||
) {
|
||||
// console.log('instancing aol-coordinate');
|
||||
if (geometryPointHost !== null) {
|
||||
this.host = geometryPointHost;
|
||||
} else if (viewHost !== null) {
|
||||
this.host = viewHost;
|
||||
} else if (overlayHost !== null) {
|
||||
this.host = overlayHost;
|
||||
}
|
||||
}
|
||||
|
||||
ngOnChanges(changes: SimpleChanges) {
|
||||
let referenceProjection: proj.Projection;
|
||||
let referenceProjectionCode: string;
|
||||
let transformedCoordinates: number[];
|
||||
|
||||
referenceProjection = this.map.instance.getView().getProjection();
|
||||
referenceProjectionCode = referenceProjection ? referenceProjection.getCode() : 'EPSG:3857';
|
||||
|
||||
if (this.srid === referenceProjectionCode) {
|
||||
transformedCoordinates = [this.x, this.y];
|
||||
} else {
|
||||
transformedCoordinates = proj.transform([this.x, this.y], this.srid, referenceProjectionCode);
|
||||
}
|
||||
|
||||
switch (this.host.componentType) {
|
||||
case 'geometry-point':
|
||||
this.host.instance.setCoordinates(transformedCoordinates);
|
||||
break;
|
||||
case 'view':
|
||||
this.host.instance.setCenter(transformedCoordinates);
|
||||
break;
|
||||
case 'overlay':
|
||||
this.host.instance.setPosition(transformedCoordinates);
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'aol-collection-coordinates',
|
||||
template: `<div class="aol-collection-coordinates"></div>`
|
||||
})
|
||||
export class CollectionCoordinatesComponent implements OnChanges {
|
||||
private host: any;
|
||||
|
||||
@Input() coordinates: [number, number][];
|
||||
@Input() srid: string = 'EPSG:3857';
|
||||
|
||||
constructor(
|
||||
private map: MapComponent,
|
||||
@Optional() geometryLinestring: GeometryLinestringComponent,
|
||||
@Optional() geometryPolygon: GeometryPolygonComponent
|
||||
) {
|
||||
// console.log('creating aol-collection-coordinates');
|
||||
if (!!geometryLinestring) {
|
||||
this.host = geometryLinestring;
|
||||
} else if (!!geometryPolygon) {
|
||||
this.host = geometryPolygon;
|
||||
} else {
|
||||
throw new Error('aol-collection-coordinates must be a child of a geometry component');
|
||||
}
|
||||
}
|
||||
|
||||
ngOnChanges(changes: SimpleChanges) {
|
||||
let referenceProjection: proj.Projection;
|
||||
let referenceProjectionCode: string;
|
||||
let transformedCoordinates: Array<Coordinate>;
|
||||
|
||||
// console.log('coordinates change: ', this.coordinates);
|
||||
|
||||
referenceProjection = this.map.instance.getView().getProjection();
|
||||
referenceProjectionCode = referenceProjection ? referenceProjection.getCode() : 'EPSG:3857';
|
||||
|
||||
if (this.srid === referenceProjectionCode) {
|
||||
transformedCoordinates = this.coordinates;
|
||||
} else {
|
||||
transformedCoordinates = [];
|
||||
this.coordinates.forEach(function (coordinate: Coordinate) {
|
||||
transformedCoordinates.push(proj.transform(coordinate, this.srid, referenceProjectionCode));
|
||||
}.bind(this));
|
||||
}
|
||||
switch (this.host.componentType) {
|
||||
case 'geometry-linestring':
|
||||
this.host.instance.setCoordinates(transformedCoordinates);
|
||||
break;
|
||||
case 'geometry-polygon':
|
||||
this.host.instance.setCoordinates([transformedCoordinates]);
|
||||
break;
|
||||
default:
|
||||
throw new Error('aol-collection-coordinates\' host is of unknown type: ' + this.host.componentType);
|
||||
// break;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,35 +0,0 @@
|
||||
import { Component, OnInit, OnDestroy, OnChanges, Input, SimpleChanges } from '@angular/core';
|
||||
import { Feature } from 'openlayers';
|
||||
import { SourceVectorComponent } from './sources';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-feature',
|
||||
template: `<ng-content></ng-content>`
|
||||
})
|
||||
export class FeatureComponent implements OnInit, OnDestroy, OnChanges {
|
||||
public componentType = 'feature';
|
||||
public instance: Feature;
|
||||
|
||||
@Input() id: string|number|undefined;
|
||||
|
||||
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 { format } from 'openlayers';
|
||||
|
||||
export class FormatComponent {
|
||||
public instance: format.Feature;
|
||||
public componentType = 'format';
|
||||
}
|
||||
@ -1,2 +0,0 @@
|
||||
export * from './format.component';
|
||||
export * from './mvt.component';
|
||||
@ -1,25 +0,0 @@
|
||||
import { Component, forwardRef, Input } from '@angular/core';
|
||||
import { format, geom } from 'openlayers';
|
||||
import { FormatComponent } from './format.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-format-mvt',
|
||||
template: '',
|
||||
providers: [
|
||||
{ provide: FormatComponent, useExisting: forwardRef(() => FormatMVTComponent) }
|
||||
]
|
||||
})
|
||||
export class FormatMVTComponent extends FormatComponent {
|
||||
instance: format.MVT;
|
||||
|
||||
@Input() featureClass: (((geom: (geom.Geometry | { [k: string]: any })) => any) |
|
||||
((geom: geom.GeometryType, arg2: number[], arg3: (number[] | number[][]), arg4: { [k: string]: any }) => any));
|
||||
@Input() geometryName: string;
|
||||
@Input() layerName: string;
|
||||
@Input() layers: string[];
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
this.instance = new format.MVT(this);
|
||||
}
|
||||
}
|
||||
@ -1,69 +0,0 @@
|
||||
import { Component, OnInit, OnDestroy } from '@angular/core';
|
||||
import { geom } from 'openlayers';
|
||||
import { FeatureComponent } from './feature.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-geometry-linestring',
|
||||
template: `<ng-content></ng-content>`
|
||||
})
|
||||
export class GeometryLinestringComponent implements OnInit, OnDestroy {
|
||||
public componentType: string = 'geometry-linestring';
|
||||
public instance: geom.LineString;
|
||||
|
||||
constructor(private host: FeatureComponent) {
|
||||
// console.log('instancing aol-geometry-linestring');
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new geom.LineString([]);
|
||||
this.host.instance.setGeometry(this.instance);
|
||||
}
|
||||
ngOnDestroy() {
|
||||
// this.host.setGeometry(null);
|
||||
}
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'aol-geometry-point',
|
||||
template: `<ng-content></ng-content>`
|
||||
})
|
||||
export class GeometryPointComponent implements OnInit, OnDestroy {
|
||||
public componentType: string = 'geometry-point';
|
||||
public instance: geom.Point;
|
||||
|
||||
constructor(private host: FeatureComponent) {
|
||||
// console.log('creating aol-geometry-point');
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new geom.Point([0, 0]); // defaulting coordinates to [0,0]. To be overridden in child component.
|
||||
this.host.instance.setGeometry(this.instance);
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
// this.host.setGeometry(null);
|
||||
}
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'aol-geometry-polygon',
|
||||
template: `<ng-content></ng-content>`
|
||||
})
|
||||
export class GeometryPolygonComponent implements OnInit, OnDestroy {
|
||||
public componentType: string = 'geometry-polygon';
|
||||
public instance: geom.Polygon;
|
||||
|
||||
constructor(private host: FeatureComponent) {
|
||||
// console.log('creating aol-geometry-polygon');
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
// defaulting coordinates to [0,0]. To be overridden in child component.
|
||||
this.instance = new geom.Polygon([ [ [0, 0], [1, 0], [1, 1] ] ]);
|
||||
this.host.instance.setGeometry(this.instance);
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
// this.host.setGeometry(null);
|
||||
}
|
||||
}
|
||||
@ -1,49 +0,0 @@
|
||||
import { Component, Input, AfterContentInit, OnChanges, SimpleChanges } from '@angular/core';
|
||||
import { Graticule, style } from 'openlayers';
|
||||
import { MapComponent } from './map.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-graticule',
|
||||
template: '<ng-content></ng-content>'
|
||||
})
|
||||
export class GraticuleComponent implements AfterContentInit, OnChanges {
|
||||
instance: any;
|
||||
public componentType: string = 'graticule';
|
||||
|
||||
@Input() strokeStyle: style.Stroke;
|
||||
@Input() showLabels: boolean;
|
||||
@Input() lonLabelPosition: number;
|
||||
@Input() latLabelPosition: number;
|
||||
|
||||
constructor(private map: MapComponent) {
|
||||
}
|
||||
|
||||
ngOnChanges(changes: SimpleChanges) {
|
||||
let properties: {[index: string]: any} = {};
|
||||
|
||||
if (!this.instance) {
|
||||
return;
|
||||
}
|
||||
|
||||
for (let 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);
|
||||
}
|
||||
}
|
||||
@ -1,19 +0,0 @@
|
||||
export * from './controls';
|
||||
export * from './formats';
|
||||
export * from './interactions';
|
||||
export * from './layers';
|
||||
export * from './sources';
|
||||
export * from './styles';
|
||||
|
||||
export * from './attribution.component';
|
||||
export * from './attributions.component';
|
||||
export * from './content.component';
|
||||
export * from './coordinate.component';
|
||||
export * from './feature.component';
|
||||
export * from './geometry.components';
|
||||
export * from './graticule.component';
|
||||
export * from './map.component';
|
||||
export * from './overlay.component';
|
||||
export * from './tilegrid.component';
|
||||
export * from './tilegridwmts.component';
|
||||
export * from './view.component';
|
||||
@ -1,23 +0,0 @@
|
||||
import { Component, OnDestroy, OnInit } from '@angular/core';
|
||||
import { interaction, Collection } from 'openlayers';
|
||||
import { MapComponent } from '../map.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-interaction-default',
|
||||
template: ''
|
||||
})
|
||||
export class DefaultInteractionComponent implements OnInit, OnDestroy {
|
||||
instance: Collection<interaction.Interaction>;
|
||||
|
||||
constructor(private map: MapComponent) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = interaction.defaults();
|
||||
this.instance.forEach((interaction) => this.map.instance.addInteraction(interaction));
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
this.instance.forEach((interaction) => this.map.instance.removeInteraction(interaction));
|
||||
}
|
||||
}
|
||||
@ -1,26 +0,0 @@
|
||||
import { Component, Input, OnDestroy, OnInit } from '@angular/core';
|
||||
import { interaction } from 'openlayers';
|
||||
import { MapComponent } from '../map.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-interaction-doubleclickzoom',
|
||||
template: ''
|
||||
})
|
||||
export class DoubleClickZoomInteractionComponent implements OnInit, OnDestroy {
|
||||
instance: interaction.DoubleClickZoom;
|
||||
|
||||
@Input() duration: number;
|
||||
@Input() delta: number;
|
||||
|
||||
constructor(private map: MapComponent) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new interaction.DoubleClickZoom(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 { interaction, format, ProjectionLike } from 'openlayers';
|
||||
import { MapComponent } from '../map.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-interaction-draganddrop',
|
||||
template: ''
|
||||
})
|
||||
export class DragAndDropInteractionComponent implements OnInit, OnDestroy {
|
||||
instance: interaction.DragAndDrop;
|
||||
|
||||
@Input() formatConstructors: ((n: format.Feature) => any)[];
|
||||
@Input() projection: ProjectionLike;
|
||||
@Input() target: Element;
|
||||
|
||||
constructor(private map: MapComponent) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new interaction.DragAndDrop(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 { interaction, EventsConditionType, DragBoxEndConditionType } from 'openlayers';
|
||||
import { MapComponent } from '../map.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-interaction-dragbox',
|
||||
template: ''
|
||||
})
|
||||
export class DragBoxInteractionComponent implements OnInit, OnDestroy {
|
||||
instance: interaction.DragBox;
|
||||
|
||||
@Input() className: string;
|
||||
@Input() condition: EventsConditionType;
|
||||
@Input() boxEndCondition: DragBoxEndConditionType;
|
||||
|
||||
constructor(private map: MapComponent) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new interaction.DragBox(this);
|
||||
this.map.instance.addInteraction(this.instance);
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
this.map.instance.removeInteraction(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,26 +0,0 @@
|
||||
import { Component, OnDestroy, OnInit, Input } from '@angular/core';
|
||||
import { interaction, EventsConditionType, Kinetic } from 'openlayers';
|
||||
import { MapComponent } from '../map.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-interaction-dragpan',
|
||||
template: ''
|
||||
})
|
||||
export class DragPanInteractionComponent implements OnInit, OnDestroy {
|
||||
instance: interaction.DragPan;
|
||||
|
||||
@Input() condition: EventsConditionType;
|
||||
@Input() kinetic: Kinetic;
|
||||
|
||||
constructor(private map: MapComponent) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new interaction.DragPan(this);
|
||||
this.map.instance.addInteraction(this.instance);
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
this.map.instance.removeInteraction(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,26 +0,0 @@
|
||||
import { Component, OnDestroy, OnInit, Input } from '@angular/core';
|
||||
import { interaction, EventsConditionType } from 'openlayers';
|
||||
import { MapComponent } from '../map.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-interaction-dragrotate',
|
||||
template: ''
|
||||
})
|
||||
export class DragRotateInteractionComponent implements OnInit, OnDestroy {
|
||||
instance: interaction.DragRotate;
|
||||
|
||||
@Input() condition: EventsConditionType;
|
||||
@Input() duration: number;
|
||||
|
||||
constructor(private map: MapComponent) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new interaction.DragRotate(this);
|
||||
this.map.instance.addInteraction(this.instance);
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
this.map.instance.removeInteraction(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,26 +0,0 @@
|
||||
import { Component, OnDestroy, OnInit, Input } from '@angular/core';
|
||||
import { interaction, EventsConditionType } from 'openlayers';
|
||||
import { MapComponent } from '../map.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-interaction-dragrotateandzoom',
|
||||
template: ''
|
||||
})
|
||||
export class DragRotateAndZoomInteractionComponent implements OnInit, OnDestroy {
|
||||
instance: interaction.DragRotate;
|
||||
|
||||
@Input() condition: EventsConditionType;
|
||||
@Input() duration: number;
|
||||
|
||||
constructor(private map: MapComponent) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new interaction.DragRotateAndZoom(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 { interaction, EventsConditionType } from 'openlayers';
|
||||
import { MapComponent } from '../map.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-interaction-dragzoom',
|
||||
template: ''
|
||||
})
|
||||
export class DragZoomInteractionComponent implements OnInit, OnDestroy {
|
||||
instance: interaction.DragZoom;
|
||||
|
||||
@Input() className: string;
|
||||
@Input() condition: EventsConditionType;
|
||||
@Input() duration: number;
|
||||
@Input() out: boolean;
|
||||
|
||||
constructor(private map: MapComponent) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new interaction.DragZoom(this);
|
||||
this.map.instance.addInteraction(this.instance);
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
this.map.instance.removeInteraction(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,50 +0,0 @@
|
||||
import { Component, Input, OnDestroy, OnInit, EventEmitter, Output } from '@angular/core';
|
||||
import { interaction } from 'openlayers';
|
||||
import { MapComponent } from '../map.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-interaction-draw',
|
||||
template: ''
|
||||
})
|
||||
export class DrawInteractionComponent implements OnInit, OnDestroy {
|
||||
instance: interaction.Draw;
|
||||
|
||||
@Input() clickTolerance?: number;
|
||||
@Input() features?: ol.Collection<ol.Feature>;
|
||||
@Input() source?: ol.source.Vector;
|
||||
@Input() snapTolerance?: number;
|
||||
@Input() type: ol.geom.GeometryType;
|
||||
@Input() maxPoints?: number;
|
||||
@Input() minPoints?: number;
|
||||
@Input() finishCondition?: ol.EventsConditionType;
|
||||
@Input() style?: (ol.style.Style | ol.style.Style[] | ol.StyleFunction);
|
||||
@Input() geometryFunction?: ol.DrawGeometryFunctionType;
|
||||
@Input() geometryName?: string;
|
||||
@Input() condition?: ol.EventsConditionType;
|
||||
@Input() freehandCondition?: ol.EventsConditionType;
|
||||
@Input() freehand?: boolean;
|
||||
@Input() wrapX?: boolean;
|
||||
|
||||
@Output() onChange = new EventEmitter<ol.interaction.Draw.Event>();
|
||||
@Output() onChangeActive = new EventEmitter<ol.interaction.Draw.Event>();
|
||||
@Output() onDrawEnd = new EventEmitter<ol.interaction.Draw.Event>();
|
||||
@Output() onDrawStart = new EventEmitter<ol.interaction.Draw.Event>();
|
||||
@Output() onPropertyChange = new EventEmitter<ol.interaction.Draw.Event>();
|
||||
|
||||
constructor(private map: MapComponent) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new interaction.Draw(this);
|
||||
this.instance.on('change', (event: ol.interaction.Draw.Event) => this.onChange.emit(event));
|
||||
this.instance.on('change:active', (event: ol.interaction.Draw.Event) => this.onChangeActive.emit(event));
|
||||
this.instance.on('drawend', (event: ol.interaction.Draw.Event) => this.onDrawEnd.emit(event));
|
||||
this.instance.on('drawstart', (event: ol.interaction.Draw.Event) => this.onDrawStart.emit(event));
|
||||
this.instance.on('propertychange', (event: ol.interaction.Draw.Event) => this.onPropertyChange.emit(event));
|
||||
this.map.instance.addInteraction(this.instance);
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
this.map.instance.removeInteraction(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,14 +0,0 @@
|
||||
export * from './default.component';
|
||||
export * from './doubleclickzoom.component';
|
||||
export * from './draganddrop.component';
|
||||
export * from './dragbox.component';
|
||||
export * from './dragpan.component';
|
||||
export * from './dragrotate.component';
|
||||
export * from './dragrotateandzoom.component';
|
||||
export * from './dragzoom.component';
|
||||
export * from './mousewheelzoom.component';
|
||||
export * from './pinchzoom.component';
|
||||
export * from './draw.component';
|
||||
export * from './select.component';
|
||||
export * from './translate.component';
|
||||
export * from './modify.component';
|
||||
@ -1,42 +0,0 @@
|
||||
import { Component, OnDestroy, OnInit, Input, Output, EventEmitter } from '@angular/core';
|
||||
import { interaction, EventsConditionType, style, StyleFunction, Collection, Feature, source } from 'openlayers';
|
||||
import { MapComponent } from '../map.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-interaction-modify',
|
||||
template: ''
|
||||
})
|
||||
export class ModifyInteractionComponent implements OnInit, OnDestroy {
|
||||
instance: interaction.Modify;
|
||||
|
||||
@Input() condition?: EventsConditionType;
|
||||
@Input() deleteCondition?: EventsConditionType;
|
||||
@Input() pixelTolerance?: number;
|
||||
@Input() style?: (style.Style | style.Style[] | StyleFunction);
|
||||
@Input() features: Collection<Feature>;
|
||||
@Input() wrapX?: boolean;
|
||||
@Input() source?: source.Vector;
|
||||
|
||||
@Output() onModifyEnd = new EventEmitter<interaction.Modify.Event>();
|
||||
@Output() onModifyStart = new EventEmitter<interaction.Modify.Event>();
|
||||
@Output() onChange = new EventEmitter<interaction.Modify.Event>();
|
||||
@Output() onChangeActive = new EventEmitter<interaction.Modify.Event>();
|
||||
@Output() onPropertyChange = new EventEmitter<interaction.Modify.Event>();
|
||||
|
||||
constructor(private map: MapComponent) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new interaction.Modify(this);
|
||||
this.instance.on('change', (event: interaction.Modify.Event) => this.onChange.emit(event));
|
||||
this.instance.on('change:active', (event: interaction.Modify.Event) => this.onChangeActive.emit(event));
|
||||
this.instance.on('propertychange', (event: interaction.Modify.Event) => this.onPropertyChange.emit(event));
|
||||
this.instance.on('modifyend', (event: interaction.Modify.Event) => this.onModifyEnd.emit(event));
|
||||
this.instance.on('modifystart', (event: interaction.Modify.Event) => this.onModifyStart.emit(event));
|
||||
this.map.instance.addInteraction(this.instance);
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
this.map.instance.removeInteraction(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,26 +0,0 @@
|
||||
import { Component, Input, OnDestroy, OnInit } from '@angular/core';
|
||||
import { interaction } from 'openlayers';
|
||||
import { MapComponent } from '../map.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-interaction-mousewheelzoom',
|
||||
template: ''
|
||||
})
|
||||
export class MouseWheelZoomInteractionComponent implements OnInit, OnDestroy {
|
||||
instance: interaction.MouseWheelZoom;
|
||||
@Input() duration: number;
|
||||
@Input() timeout: number;
|
||||
@Input() useAnchor: boolean;
|
||||
|
||||
constructor(private map: MapComponent) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new interaction.MouseWheelZoom(this);
|
||||
this.map.instance.addInteraction(this.instance);
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
this.map.instance.removeInteraction(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,36 +0,0 @@
|
||||
"use strict";
|
||||
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
||||
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
||||
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
||||
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
||||
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
||||
};
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
var core_1 = require("@angular/core");
|
||||
var openlayers_1 = require("openlayers");
|
||||
var PinchZoomInteractionComponent = (function () {
|
||||
function PinchZoomInteractionComponent(map) {
|
||||
this.map = map;
|
||||
}
|
||||
PinchZoomInteractionComponent.prototype.ngOnInit = function () {
|
||||
this.instance = new openlayers_1.interaction.PinchZoom(this);
|
||||
this.map.instance.addInteraction(this.instance);
|
||||
};
|
||||
PinchZoomInteractionComponent.prototype.ngOnDestroy = function () {
|
||||
this.map.instance.removeInteraction(this.instance);
|
||||
};
|
||||
return PinchZoomInteractionComponent;
|
||||
}());
|
||||
__decorate([
|
||||
core_1.Input()
|
||||
], PinchZoomInteractionComponent.prototype, "duration", void 0);
|
||||
__decorate([
|
||||
core_1.Input()
|
||||
], PinchZoomInteractionComponent.prototype, "constrainResolution", void 0);
|
||||
PinchZoomInteractionComponent = __decorate([
|
||||
core_1.Component({
|
||||
selector: 'aol-interaction-pinchzoom',
|
||||
template: ''
|
||||
})
|
||||
], PinchZoomInteractionComponent);
|
||||
exports.PinchZoomInteractionComponent = PinchZoomInteractionComponent;
|
||||
@ -1,26 +0,0 @@
|
||||
import { Component, OnDestroy, OnInit, Input } from '@angular/core';
|
||||
import { interaction } from 'openlayers';
|
||||
import { MapComponent } from '../map.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-interaction-pinchzoom',
|
||||
template: ''
|
||||
})
|
||||
export class PinchZoomInteractionComponent implements OnInit, OnDestroy {
|
||||
instance: interaction.PinchZoom;
|
||||
|
||||
@Input() duration: number;
|
||||
@Input() constrainResolution: boolean;
|
||||
|
||||
constructor(private map: MapComponent) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new interaction.PinchZoom(this);
|
||||
this.map.instance.addInteraction(this.instance);
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
this.map.instance.removeInteraction(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,44 +0,0 @@
|
||||
import { Component, OnDestroy, OnInit, Input, Output, EventEmitter } from '@angular/core';
|
||||
import { interaction, EventsConditionType, layer, style, Collection, SelectFilterFunction, StyleFunction, Feature } from 'openlayers';
|
||||
import { MapComponent } from '../map.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-interaction-select',
|
||||
template: ''
|
||||
})
|
||||
export class SelectInteractionComponent implements OnInit, OnDestroy {
|
||||
instance: interaction.Select;
|
||||
|
||||
|
||||
@Input() addCondition?: EventsConditionType;
|
||||
@Input() condition?: EventsConditionType;
|
||||
@Input() layers?: (layer.Layer[] | ((layer: layer.Layer) => boolean));
|
||||
@Input() style?: (style.Style | style.Style[] | StyleFunction);
|
||||
@Input() removeCondition?: EventsConditionType;
|
||||
@Input() toggleCondition?: EventsConditionType;
|
||||
@Input() multi?: boolean;
|
||||
@Input() features?: Collection<Feature>;
|
||||
@Input() filter?: SelectFilterFunction;
|
||||
@Input() wrapX?: boolean;
|
||||
|
||||
@Output() onChange = new EventEmitter<interaction.Select.Event>();
|
||||
@Output() onSelect = new EventEmitter<interaction.Select.Event>();
|
||||
@Output() onPropertyChange = new EventEmitter<interaction.Select.Event>();
|
||||
|
||||
constructor(private map: MapComponent) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new interaction.Select(this);
|
||||
|
||||
this.instance.on('change', (event: interaction.Select.Event) => this.onChange.emit(event));
|
||||
this.instance.on('select', (event: interaction.Select.Event) => this.onSelect.emit(event));
|
||||
this.instance.on('propertychange', (event: interaction.Select.Event) => this.onPropertyChange.emit(event));
|
||||
|
||||
this.map.instance.addInteraction(this.instance);
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
this.map.instance.removeInteraction(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,45 +0,0 @@
|
||||
import { Component, OnDestroy, OnInit, Input, Output, EventEmitter } from '@angular/core';
|
||||
import { interaction, layer, Collection, Feature } from 'openlayers';
|
||||
import { MapComponent } from '../map.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-interaction-translate',
|
||||
template: ''
|
||||
})
|
||||
export class TranslateInteractionComponent implements OnInit, OnDestroy {
|
||||
instance: interaction.Translate;
|
||||
|
||||
@Input() features?: Collection<Feature>;
|
||||
@Input() layers?: (layer.Layer[] | ((layer: layer.Layer) => boolean));
|
||||
@Input() hitTolerance?: number;
|
||||
|
||||
@Output() onChange: EventEmitter<interaction.Translate.Event>;
|
||||
@Output() onPropertyChange: EventEmitter<interaction.Translate.Event>;
|
||||
@Output() onTranslateEnd: EventEmitter<interaction.Translate.Event>;
|
||||
@Output() onTranslateStart: EventEmitter<interaction.Translate.Event>;
|
||||
@Output() onTranslating: EventEmitter<interaction.Translate.Event>;
|
||||
|
||||
constructor(private map: MapComponent) {
|
||||
this.onChange = new EventEmitter<interaction.Translate.Event>();
|
||||
this.onPropertyChange = new EventEmitter<interaction.Translate.Event>();
|
||||
this.onTranslateEnd = new EventEmitter<interaction.Translate.Event>();
|
||||
this.onTranslateStart = new EventEmitter<interaction.Translate.Event>();
|
||||
this.onTranslating = new EventEmitter<interaction.Translate.Event>();
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new interaction.Translate(this);
|
||||
|
||||
this.instance.on('change', (event: interaction.Translate.Event) => this.onChange.emit(event));
|
||||
this.instance.on('propertychange', (event: interaction.Translate.Event) => this.onPropertyChange.emit(event));
|
||||
this.instance.on('translateend', (event: interaction.Translate.Event) => this.onTranslateEnd.emit(event));
|
||||
this.instance.on('translatestart', (event: interaction.Translate.Event) => this.onTranslateStart.emit(event));
|
||||
this.instance.on('translating', (event: interaction.Translate.Event) => this.onTranslating.emit(event));
|
||||
|
||||
this.map.instance.addInteraction(this.instance);
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
this.map.instance.removeInteraction(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,6 +0,0 @@
|
||||
export * from './layer.component';
|
||||
export * from './layergroup.component';
|
||||
export * from './layerimage.component';
|
||||
export * from './layertile.component';
|
||||
export * from './layervector.component';
|
||||
export * from './layervectortile.component';
|
||||
@ -1,59 +0,0 @@
|
||||
import { OnDestroy, OnInit, OnChanges, Input, SimpleChanges, Component, Injectable } from '@angular/core';
|
||||
import { layer, Extent } from 'openlayers';
|
||||
import { MapComponent } from '../map.component';
|
||||
import { LayerGroupComponent } from './layergroup.component';
|
||||
|
||||
@Injectable()
|
||||
export abstract class LayerComponent implements OnInit, OnChanges, OnDestroy {
|
||||
public instance: any;
|
||||
public componentType: string = 'layer';
|
||||
|
||||
@Input() opacity: number;
|
||||
@Input() visible: boolean;
|
||||
@Input() extent: Extent;
|
||||
@Input() zIndex: number;
|
||||
@Input() minResolution: number;
|
||||
@Input() maxResolution: number;
|
||||
|
||||
@Input() precompose: (evt: ol.events.Event) => void;
|
||||
@Input() postcompose: (evt: ol.events.Event) => void;
|
||||
|
||||
constructor(protected host: LayerGroupComponent | MapComponent) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
if (this.precompose !== null && this.precompose !== undefined) {
|
||||
this.instance.on('precompose', this.precompose);
|
||||
}
|
||||
if (this.postcompose !== null && this.postcompose !== undefined) {
|
||||
this.instance.on('postcompose', this.postcompose);
|
||||
}
|
||||
this.host.instance.getLayers().push(this.instance);
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
this.host.instance.getLayers().remove(this.instance);
|
||||
}
|
||||
|
||||
ngOnChanges(changes: SimpleChanges) {
|
||||
let properties: { [index: string]: any } = {};
|
||||
if (!this.instance) {
|
||||
return;
|
||||
}
|
||||
for (let key in changes) {
|
||||
if (changes.hasOwnProperty(key)) {
|
||||
properties[key] = changes[key].currentValue;
|
||||
if (key === 'precompose') {
|
||||
this.instance.un('precompose', changes[key].previousValue)
|
||||
this.instance.on('precompose', changes[key].currentValue);
|
||||
}
|
||||
if (key === 'postcompose') {
|
||||
this.instance.un('postcompose', changes[key].previousValue)
|
||||
this.instance.on('postcompose', changes[key].currentValue);
|
||||
}
|
||||
}
|
||||
}
|
||||
// console.log('changes detected in aol-layer, setting new properties: ', properties);
|
||||
this.instance.setProperties(properties, false);
|
||||
}
|
||||
}
|
||||
@ -1,23 +0,0 @@
|
||||
import { Component, OnDestroy, OnInit, SkipSelf, Inject, Optional } from '@angular/core';
|
||||
import { layer } from 'openlayers';
|
||||
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: ol.layer.Group;
|
||||
|
||||
constructor(map: MapComponent,
|
||||
@SkipSelf() @Optional() group?: LayerGroupComponent) {
|
||||
super(group || map);
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
// console.log(`creating ol.layer.Group instance with:`, this);
|
||||
this.instance = new layer.Group(this);
|
||||
super.ngOnInit();
|
||||
}
|
||||
}
|
||||
@ -1,37 +0,0 @@
|
||||
import {
|
||||
Component, EventEmitter, Input, OnChanges, OnInit, Optional,
|
||||
SimpleChanges
|
||||
} from '@angular/core';
|
||||
import { Extent, layer, source } from 'openlayers';
|
||||
import { MapComponent } from '../map.component';
|
||||
import { LayerComponent } from './layer.component';
|
||||
import { LayerGroupComponent } from './layergroup.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-layer-image',
|
||||
template: `<ng-content></ng-content>`
|
||||
})
|
||||
export class LayerImageComponent extends LayerComponent implements OnInit, OnChanges {
|
||||
public source: source.Image;
|
||||
|
||||
@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 layer.Image(this);
|
||||
super.ngOnInit();
|
||||
}
|
||||
|
||||
ngOnChanges(changes: SimpleChanges) {
|
||||
super.ngOnChanges(changes);
|
||||
}
|
||||
}
|
||||
@ -1,34 +0,0 @@
|
||||
import {
|
||||
Component, OnDestroy, OnInit, Input, Optional, OnChanges,
|
||||
SimpleChanges
|
||||
} from '@angular/core';
|
||||
import { layer, source } from 'openlayers';
|
||||
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 {
|
||||
public source: source.Tile;
|
||||
|
||||
@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 layer.Tile(this);
|
||||
super.ngOnInit();
|
||||
}
|
||||
|
||||
ngOnChanges(changes: SimpleChanges) {
|
||||
super.ngOnChanges(changes);
|
||||
}
|
||||
}
|
||||
@ -1,33 +0,0 @@
|
||||
import {
|
||||
Component, OnDestroy, OnInit, Input, Optional, OnChanges,
|
||||
SimpleChanges
|
||||
} from '@angular/core';
|
||||
import { layer, source } from 'openlayers';
|
||||
import { MapComponent } from '../map.component';
|
||||
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 {
|
||||
public source: source.Vector;
|
||||
|
||||
@Input() renderBuffer: number;
|
||||
|
||||
constructor(map: MapComponent,
|
||||
@Optional() group?: LayerGroupComponent) {
|
||||
super(group || map);
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
// console.log('creating ol.layer.Vector instance with:', this);
|
||||
this.instance = new layer.Vector(this);
|
||||
super.ngOnInit();
|
||||
}
|
||||
|
||||
ngOnChanges(changes: SimpleChanges) {
|
||||
super.ngOnChanges(changes);
|
||||
}
|
||||
}
|
||||
@ -1,36 +0,0 @@
|
||||
import { Component, OnInit, Input, Optional, SimpleChanges, OnChanges } from '@angular/core';
|
||||
import { layer, style, StyleFunction } from 'openlayers';
|
||||
import { MapComponent } from '../map.component';
|
||||
import { LayerComponent } from './layer.component';
|
||||
import { LayerGroupComponent } from './layergroup.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-layer-vectortile',
|
||||
template: `<ng-content></ng-content>`
|
||||
})
|
||||
export class LayerVectorTileComponent extends LayerComponent implements OnInit, OnChanges {
|
||||
|
||||
@Input() renderBuffer: number;
|
||||
@Input() renderMode: layer.VectorTileRenderType|string;
|
||||
/* not marked as optional in the typings */
|
||||
@Input() renderOrder: (feature1: ol.Feature, feature2: ol.Feature) => number;
|
||||
@Input() style: (style.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 layer.VectorTile(this);
|
||||
super.ngOnInit();
|
||||
}
|
||||
|
||||
ngOnChanges(changes: SimpleChanges) {
|
||||
super.ngOnChanges(changes);
|
||||
}
|
||||
}
|
||||
@ -1,90 +0,0 @@
|
||||
import {
|
||||
Component, OnInit, ElementRef, Input, Output, EventEmitter, AfterViewInit,
|
||||
SimpleChanges, OnChanges
|
||||
} from '@angular/core';
|
||||
import {
|
||||
Map, MapBrowserEvent, MapEvent, render, ObjectEvent, control,
|
||||
interaction
|
||||
} from 'openlayers';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-map',
|
||||
template: `<div [style.width]="width" [style.height]="height"></div><ng-content></ng-content>`
|
||||
})
|
||||
|
||||
export class MapComponent implements OnInit, AfterViewInit, OnChanges {
|
||||
public instance: Map;
|
||||
public componentType: string = 'map';
|
||||
|
||||
@Input() width: string = '100%';
|
||||
@Input() height: string = '100%';
|
||||
@Input() pixelRatio: number;
|
||||
@Input() keyboardEventTarget: Element|string;
|
||||
@Input() loadTilesWhileAnimating: boolean;
|
||||
@Input() loadTilesWhileInteracting: boolean;
|
||||
@Input() logo: string|boolean;
|
||||
@Input() renderer: 'canvas'|'webgl';
|
||||
|
||||
|
||||
@Output() onClick: EventEmitter<MapBrowserEvent>;
|
||||
@Output() onDblClick: EventEmitter<MapBrowserEvent>;
|
||||
@Output() onMoveEnd: EventEmitter<MapEvent>;
|
||||
@Output() onPointerDrag: EventEmitter<MapBrowserEvent>;
|
||||
@Output() onPointerMove: EventEmitter<MapBrowserEvent>;
|
||||
@Output() onPostCompose: EventEmitter<render.Event>;
|
||||
@Output() onPostRender: EventEmitter<MapEvent>;
|
||||
@Output() onPreCompose: EventEmitter<render.Event>;
|
||||
@Output() onPropertyChange: EventEmitter<ObjectEvent>;
|
||||
@Output() onSingleClick: EventEmitter<MapBrowserEvent>;
|
||||
|
||||
// we pass empty arrays to not get default controls/interactions because we have our own directives
|
||||
controls: control.Control[] = [];
|
||||
interactions: interaction.Interaction[] = [];
|
||||
|
||||
constructor(private host: ElementRef) {
|
||||
this.onClick = new EventEmitter<MapBrowserEvent>();
|
||||
this.onDblClick = new EventEmitter<MapBrowserEvent>();
|
||||
this.onMoveEnd = new EventEmitter<MapEvent>();
|
||||
this.onPointerDrag = new EventEmitter<MapBrowserEvent>();
|
||||
this.onPointerMove = new EventEmitter<MapBrowserEvent>();
|
||||
this.onPostCompose = new EventEmitter<render.Event>();
|
||||
this.onPostRender = new EventEmitter<MapEvent>();
|
||||
this.onPreCompose = new EventEmitter<render.Event>();
|
||||
this.onPropertyChange = new EventEmitter<ObjectEvent>();
|
||||
this.onSingleClick = new EventEmitter<MapBrowserEvent>();
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
// console.log('creating ol.Map instance with:', this);
|
||||
this.instance = new Map(this);
|
||||
this.instance.setTarget(this.host.nativeElement.firstElementChild);
|
||||
this.instance.on('click', (event: MapBrowserEvent) => this.onClick.emit(event));
|
||||
this.instance.on('dblclick', (event: MapBrowserEvent) => this.onDblClick.emit(event));
|
||||
this.instance.on('moveend', (event: MapEvent) => this.onMoveEnd.emit(event));
|
||||
this.instance.on('pointerdrag', (event: MapBrowserEvent) => this.onPointerDrag.emit(event));
|
||||
this.instance.on('pointermove', (event: MapBrowserEvent) => this.onPointerMove.emit(event));
|
||||
this.instance.on('postcompose', (event: render.Event) => this.onPostCompose.emit(event));
|
||||
this.instance.on('postrender', (event: MapEvent) => this.onPostRender.emit(event));
|
||||
this.instance.on('precompose', (event: render.Event) => this.onPreCompose.emit(event));
|
||||
this.instance.on('propertychange', (event: ObjectEvent) => this.onPropertyChange.emit(event));
|
||||
this.instance.on('singleclick', (event: MapBrowserEvent) => this.onSingleClick.emit(event));
|
||||
}
|
||||
|
||||
ngOnChanges(changes: SimpleChanges) {
|
||||
let properties: { [index: string]: any } = {};
|
||||
if (!this.instance) {
|
||||
return;
|
||||
}
|
||||
for (let 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,43 +0,0 @@
|
||||
import { Component, ContentChild, Input, OnDestroy, OnInit } from '@angular/core';
|
||||
import { MapComponent } from './map.component';
|
||||
import { Overlay, OverlayPositioning } from 'openlayers';
|
||||
import { ContentComponent } from './content.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-overlay',
|
||||
template: '<ng-content></ng-content>'
|
||||
})
|
||||
export class OverlayComponent implements OnInit, OnDestroy {
|
||||
componentType = 'overlay';
|
||||
instance: Overlay;
|
||||
element: Element;
|
||||
@ContentChild(ContentComponent) content: ContentComponent;
|
||||
|
||||
@Input() id: number|string;
|
||||
@Input() offset: number[];
|
||||
@Input() positioning: OverlayPositioning|string;
|
||||
@Input() stopEvent: boolean;
|
||||
@Input() insertFirst: boolean;
|
||||
@Input() autoPan: boolean;
|
||||
@Input() autoPanAnimation: olx.animation.PanOptions;
|
||||
@Input() autoPanMargin: number;
|
||||
|
||||
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,34 +0,0 @@
|
||||
import { Component, Host, Input, OnInit, forwardRef } from '@angular/core';
|
||||
import { source, TileLoadFunctionType } from 'openlayers';
|
||||
import { LayerTileComponent } from '../layers';
|
||||
import { SourceComponent } from './source.component';
|
||||
|
||||
@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 {
|
||||
instance: source.BingMaps;
|
||||
|
||||
@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: TileLoadFunctionType;
|
||||
@Input() wrapX: boolean;
|
||||
|
||||
constructor(@Host() layer: LayerTileComponent) {
|
||||
super(layer);
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new source.BingMaps(this);
|
||||
this.host.instance.setSource(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,34 +0,0 @@
|
||||
import {Component, Host, Input, OnInit, forwardRef, ContentChild, AfterContentInit} from '@angular/core';
|
||||
import { source, Feature, geom } from 'openlayers';
|
||||
import { LayerVectorComponent } from '../layers';
|
||||
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 {
|
||||
instance: source.Cluster;
|
||||
|
||||
@Input() distance: number;
|
||||
@Input() geometryFunction?: ((feature: Feature) => geom.Point);
|
||||
|
||||
@ContentChild(SourceVectorComponent) sourceVectorComponent: SourceVectorComponent;
|
||||
source: source.Vector;
|
||||
|
||||
constructor(@Host() layer: LayerVectorComponent) {
|
||||
super(layer);
|
||||
}
|
||||
|
||||
ngAfterContentInit() {
|
||||
this.source = this.sourceVectorComponent.instance;
|
||||
|
||||
this.instance = new source.Cluster(this);
|
||||
this.host.instance.setSource(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,32 +0,0 @@
|
||||
import { Component, Host, Input, OnInit, forwardRef } from '@angular/core';
|
||||
import { source, ProjectionLike, format } from 'openlayers';
|
||||
import { LayerVectorComponent } from '../layers';
|
||||
import { FormatComponent } from '../formats';
|
||||
import { SourceComponent } from './source.component';
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'aol-source-geojson',
|
||||
template: `<ng-content></ng-content>`,
|
||||
providers: [
|
||||
{ provide: SourceComponent, useExisting: forwardRef(() => SourceGeoJSONComponent) }
|
||||
]
|
||||
})
|
||||
export class SourceGeoJSONComponent extends SourceComponent implements OnInit {
|
||||
instance: source.Vector;
|
||||
format: format.Feature;
|
||||
@Input() defaultDataProjection: ProjectionLike;
|
||||
@Input() featureProjection: ProjectionLike;
|
||||
@Input() geometryName: string;
|
||||
@Input() url: string;
|
||||
|
||||
constructor( @Host() layer: LayerVectorComponent) {
|
||||
super(layer);
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.format = new format.GeoJSON(this);
|
||||
this.instance = new source.Vector(this);
|
||||
this.host.instance.setSource(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,31 +0,0 @@
|
||||
import { Component, Host, Input, OnInit, forwardRef } from '@angular/core';
|
||||
import { ProjectionLike, source, Extent, AttributionLike, ImageLoadFunctionType, Size } from 'openlayers';
|
||||
import { SourceComponent } from './source.component';
|
||||
import { LayerImageComponent } from '../layers/layerimage.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-source-imagestatic',
|
||||
template: `<ng-content></ng-content>`,
|
||||
providers: [{ provide: SourceComponent, useExisting: forwardRef(() => SourceImageStaticComponent) }],
|
||||
})
|
||||
export class SourceImageStaticComponent extends SourceComponent implements OnInit {
|
||||
instance: source.ImageStatic;
|
||||
|
||||
@Input() projection: (ProjectionLike | string);
|
||||
@Input() imageExtent: Extent;
|
||||
@Input() url: string;
|
||||
@Input() attributions: AttributionLike;
|
||||
@Input() crossOrigin?: string;
|
||||
@Input() imageLoadFunction?: ImageLoadFunctionType;
|
||||
@Input() logo?: (string | olx.LogoOptions);
|
||||
@Input() imageSize?: Size;
|
||||
|
||||
constructor(@Host() layer: LayerImageComponent) {
|
||||
super(layer);
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new source.ImageStatic(this);
|
||||
this.host.instance.setSource(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,36 +0,0 @@
|
||||
import { Component, Host, Input, OnInit, forwardRef } from '@angular/core';
|
||||
import { AttributionLike, ImageLoadFunctionType, ProjectionLike, source } from 'openlayers';
|
||||
import { LayerImageComponent } from '../layers';
|
||||
import { SourceComponent } from './source.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-source-imagewms',
|
||||
template: `<ng-content></ng-content>`,
|
||||
providers: [
|
||||
{ provide: SourceComponent, useExisting: forwardRef(() => SourceImageWMSComponent) }
|
||||
]
|
||||
})
|
||||
export class SourceImageWMSComponent extends SourceComponent implements OnInit {
|
||||
instance: source.ImageWMS;
|
||||
|
||||
@Input() attributions: AttributionLike;
|
||||
@Input() crossOrigin: string;
|
||||
@Input() hidpi: boolean;
|
||||
@Input() serverType: string;
|
||||
@Input() imageLoadFunction?: ImageLoadFunctionType;
|
||||
@Input() logo: (string | olx.LogoOptions);
|
||||
@Input() params: Object;
|
||||
@Input() projection: (ProjectionLike | string);
|
||||
@Input() ratio: number;
|
||||
@Input() resolutions: Array<number>;
|
||||
@Input() url: string;
|
||||
|
||||
constructor(@Host() layer: LayerImageComponent) {
|
||||
super(layer);
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new source.ImageWMS(this);
|
||||
this.host.instance.setSource(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,15 +0,0 @@
|
||||
export * from './bingmaps.component';
|
||||
export * from './osm.component';
|
||||
export * from './source.component';
|
||||
export * from './vector.component';
|
||||
export * from './vectortile.component';
|
||||
export * from './xyz.component';
|
||||
export * from './tilewms.component';
|
||||
export * from './geojson.component';
|
||||
export * from './tilejson.component';
|
||||
export * from './tileutfgrid.component';
|
||||
export * from './tilewmts.component';
|
||||
export * from './imagewms.component';
|
||||
export * from './imagestatic.component';
|
||||
export * from './cluster.component';
|
||||
export * from './raster.component';
|
||||
@ -1,40 +0,0 @@
|
||||
import {Component, Host, forwardRef, Input, AfterContentInit, Optional, OnInit} from '@angular/core';
|
||||
import { source, AttributionLike, TileLoadFunctionType } from 'openlayers';
|
||||
import { LayerTileComponent } from '../layers';
|
||||
import { SourceComponent } from './source.component';
|
||||
import { SourceXYZComponent } from './xyz.component';
|
||||
import {SourceRasterComponent} from './raster.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 {
|
||||
instance: source.OSM;
|
||||
|
||||
@Input() attributions: AttributionLike;
|
||||
@Input() cacheSize: number;
|
||||
@Input() crossOrigin: string;
|
||||
@Input() maxZoom: number;
|
||||
@Input() opaque: boolean;
|
||||
@Input() reprojectionErrorThreshold: number;
|
||||
@Input() tileLoadFunction: TileLoadFunctionType;
|
||||
@Input() url: string;
|
||||
@Input() wrapX: boolean;
|
||||
|
||||
constructor(@Host() @Optional() layer: LayerTileComponent,
|
||||
@Host() @Optional() raster?: SourceRasterComponent) {
|
||||
super(layer, raster);
|
||||
}
|
||||
|
||||
ngAfterContentInit() {
|
||||
if (this.tileGridXYZ) {
|
||||
this.tileGrid = this.tileGridXYZ.instance;
|
||||
}
|
||||
this.instance = new source.OSM(this);
|
||||
this._register(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,42 +0,0 @@
|
||||
import { AfterContentInit, Component, EventEmitter, forwardRef, Host, Input, Output } from '@angular/core';
|
||||
import { RasterOperation, RasterOperationType, source } from 'openlayers';
|
||||
|
||||
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 {
|
||||
instance: source.Raster;
|
||||
|
||||
@Input() operation?: RasterOperation;
|
||||
@Input() threads?: number;
|
||||
@Input() lib?: Object;
|
||||
@Input() operationType?: RasterOperationType;
|
||||
|
||||
@Output() beforeOperations: EventEmitter<source.RasterEvent> = new EventEmitter<source.RasterEvent>();
|
||||
@Output() afterOperations: EventEmitter<source.RasterEvent> = new EventEmitter<source.RasterEvent>();
|
||||
|
||||
sources: source.Source[] = [];
|
||||
|
||||
constructor(@Host() layer: LayerImageComponent) {
|
||||
super(layer);
|
||||
}
|
||||
|
||||
ngAfterContentInit() {
|
||||
this.instance = new source.Raster(this);
|
||||
|
||||
this.instance.on('beforeoperations', (event: source.RasterEvent) => this.beforeOperations.emit(event));
|
||||
this.instance.on('afteroperations', (event: source.RasterEvent) => this.afterOperations.emit(event));
|
||||
|
||||
this._register(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,39 +0,0 @@
|
||||
import {AfterContentInit, Component, Host, Input, OnDestroy, OnInit, Optional} from '@angular/core';
|
||||
import { source } from 'openlayers';
|
||||
import { LayerComponent } from '../layers';
|
||||
import AttributionLike = ol.AttributionLike;
|
||||
import { SourceRasterComponent } from './raster.component';
|
||||
|
||||
@Component({
|
||||
selector: 'required-for-ivy-2',
|
||||
template: `<ng-content></ng-content>`
|
||||
})
|
||||
export class SourceComponent implements OnDestroy {
|
||||
public instance: source.Source;
|
||||
public componentType: string = 'source';
|
||||
|
||||
@Input() attributions: AttributionLike;
|
||||
|
||||
constructor(protected host: LayerComponent, protected raster?: SourceRasterComponent) {
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
if (this.host) {
|
||||
this.host.instance.setSource(null);
|
||||
}
|
||||
|
||||
if (this.raster) {
|
||||
this.raster.sources = [];
|
||||
}
|
||||
}
|
||||
|
||||
protected _register(source: source.Source) {
|
||||
if (this.host) {
|
||||
this.host.instance.setSource(source);
|
||||
}
|
||||
|
||||
if (this.raster) {
|
||||
this.raster.sources = [source];
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,26 +0,0 @@
|
||||
import { Component, Host, Input, OnInit, forwardRef } from '@angular/core';
|
||||
import { AttributionLike, source, TileLoadFunctionType, tilegrid } from 'openlayers';
|
||||
import { LayerTileComponent } from '../layers';
|
||||
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 {
|
||||
instance: source.TileJSON;
|
||||
|
||||
@Input() url: string;
|
||||
|
||||
constructor(@Host() layer: LayerTileComponent) {
|
||||
super(layer);
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new source.TileJSON(this);
|
||||
this.host.instance.setSource(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,25 +0,0 @@
|
||||
import { Component, Host, Input, OnInit, forwardRef } from '@angular/core';
|
||||
import { source } from 'openlayers';
|
||||
import { LayerTileComponent } from '../layers';
|
||||
import { SourceComponent } from './source.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-source-tileutfgrid',
|
||||
template: `<ng-content></ng-content>`,
|
||||
providers: [
|
||||
{ provide: SourceComponent, useExisting: forwardRef(() => SourceTileUTFGridComponent) }
|
||||
]
|
||||
})
|
||||
export class SourceTileUTFGridComponent extends SourceComponent implements OnInit {
|
||||
instance: source.TileUTFGrid;
|
||||
@Input() tileJSON: JSON;
|
||||
|
||||
constructor(@Host() layer: LayerTileComponent) {
|
||||
super(layer);
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new source.TileUTFGrid(this);
|
||||
this.host.instance.setSource(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,37 +0,0 @@
|
||||
import { Component, Host, Input, OnInit, forwardRef } from '@angular/core';
|
||||
import { source, TileLoadFunctionType, tilegrid } from 'openlayers';
|
||||
import { LayerTileComponent } from '../layers';
|
||||
import { SourceComponent } from './source.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-source-tilewms',
|
||||
template: `<ng-content></ng-content>`,
|
||||
providers: [
|
||||
{ provide: SourceComponent, useExisting: forwardRef(() => SourceTileWMSComponent) }
|
||||
]
|
||||
})
|
||||
export class SourceTileWMSComponent extends SourceComponent implements OnInit {
|
||||
instance: source.TileWMS;
|
||||
@Input() cacheSize: number;
|
||||
@Input() crossOrigin: string;
|
||||
@Input() gutter: number;
|
||||
@Input() hidpi: boolean;
|
||||
@Input() params: Object;
|
||||
@Input() projection: string;
|
||||
@Input() reprojectionErrorThreshold: number;
|
||||
@Input() serverType: string;
|
||||
@Input() tileGrid: tilegrid.TileGrid;
|
||||
@Input() tileLoadFunction: TileLoadFunctionType;
|
||||
@Input() url: string;
|
||||
@Input() urls: string[];
|
||||
@Input() wrapX: boolean;
|
||||
|
||||
constructor(@Host() layer: LayerTileComponent) {
|
||||
super(layer);
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new source.TileWMS(this);
|
||||
this.host.instance.setSource(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,84 +0,0 @@
|
||||
import {Component, Host, Input, forwardRef, AfterContentInit, ContentChild, SimpleChanges} from '@angular/core';
|
||||
import {
|
||||
TileLoadFunctionType,
|
||||
tilegrid,
|
||||
ProjectionLike,
|
||||
source,
|
||||
ImageTile,
|
||||
TileCoord,
|
||||
Tile
|
||||
} from 'openlayers';
|
||||
import {LayerTileComponent} from '../layers';
|
||||
import {SourceComponent} from './source.component';
|
||||
import {TileGridWMTSComponent} from '../tilegridwmts.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-source-tilewmts',
|
||||
template: `<ng-content></ng-content>`,
|
||||
providers: [
|
||||
{provide: SourceComponent, useExisting: forwardRef(() => SourceTileWMTSComponent)}
|
||||
]
|
||||
})
|
||||
export class SourceTileWMTSComponent extends SourceComponent implements AfterContentInit {
|
||||
|
||||
instance: source.WMTS;
|
||||
@Input() cacheSize?: number;
|
||||
@Input() crossOrigin?: (string);
|
||||
@Input() logo?: (string | olx.LogoOptions);
|
||||
@Input() tileGrid: tilegrid.WMTS;
|
||||
@Input() projection: ProjectionLike;
|
||||
@Input() reprojectionErrorThreshold?: number;
|
||||
@Input() requestEncoding?: (source.WMTSRequestEncoding | string);
|
||||
@Input() layer: string;
|
||||
@Input() style: string;
|
||||
@Input() tileClass?: ((n: ImageTile, coords: TileCoord, state: Tile.State, s1: string, s2: string, type: TileLoadFunctionType) => any);
|
||||
@Input() tilePixelRatio?: number;
|
||||
@Input() version?: string;
|
||||
@Input() format?: string;
|
||||
@Input() matrixSet: string;
|
||||
@Input() dimensions?: GlobalObject;
|
||||
@Input() url?: string;
|
||||
@Input() tileLoadFunction?: TileLoadFunctionType;
|
||||
@Input() urls?: string[];
|
||||
@Input() wrapX?: boolean;
|
||||
|
||||
@ContentChild(TileGridWMTSComponent) tileGridWMTS: TileGridWMTSComponent;
|
||||
|
||||
constructor(@Host() layer: LayerTileComponent) {
|
||||
super(layer);
|
||||
}
|
||||
|
||||
|
||||
ngOnChanges(changes: SimpleChanges) {
|
||||
let properties: {[index: string]: any} = {};
|
||||
if (!this.instance) {
|
||||
return;
|
||||
}
|
||||
for (let 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 source.WMTS(this);
|
||||
this.host.instance.setSource(this.instance);
|
||||
}
|
||||
|
||||
ngAfterContentInit(): void {
|
||||
if (this.tileGridWMTS) {
|
||||
this.tileGrid = this.tileGridWMTS.instance;
|
||||
this.setLayerSource();
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,30 +0,0 @@
|
||||
import { Component, Host, Input, OnInit, forwardRef } from '@angular/core';
|
||||
import { source } from 'openlayers';
|
||||
import { LayerVectorComponent } from '../layers';
|
||||
import { SourceComponent } from './source.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-source-vector',
|
||||
template: `<ng-content></ng-content>`,
|
||||
providers: [
|
||||
{ provide: SourceComponent, useExisting: forwardRef(() => SourceVectorComponent) }
|
||||
]
|
||||
})
|
||||
export class SourceVectorComponent extends SourceComponent implements OnInit {
|
||||
instance: source.Vector;
|
||||
@Input() overlaps: boolean;
|
||||
@Input() useSpatialIndex: boolean;
|
||||
@Input() wrapX: boolean;
|
||||
@Input() url: string;
|
||||
@Input() format: ol.format.Feature;
|
||||
@Input() strategy: ol.LoadingStrategy;
|
||||
|
||||
constructor(@Host() layer: LayerVectorComponent) {
|
||||
super(layer);
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new source.Vector(this);
|
||||
this.host.instance.setSource(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,43 +0,0 @@
|
||||
import { Component, Host, Input, forwardRef, ContentChild, AfterContentInit } from '@angular/core';
|
||||
import { source, ProjectionLike, TileUrlFunctionType, format, tilegrid } from 'openlayers';
|
||||
import { LayerVectorTileComponent } from '../layers';
|
||||
import { FormatComponent } from '../formats';
|
||||
import { TileGridComponent } from '../tilegrid.component';
|
||||
import { SourceComponent } from './source.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-source-vectortile',
|
||||
template: `<ng-content></ng-content>`,
|
||||
providers: [
|
||||
{ provide: SourceComponent, useExisting: forwardRef(() => SourceVectorTileComponent) }
|
||||
]
|
||||
})
|
||||
export class SourceVectorTileComponent extends SourceComponent implements AfterContentInit {
|
||||
public instance: source.VectorTile;
|
||||
@Input() cacheSize: number;
|
||||
@Input() overlaps: boolean;
|
||||
@Input() projection: ProjectionLike;
|
||||
@Input() tilePixelRatio: number;
|
||||
@Input() tileUrlFunction: TileUrlFunctionType;
|
||||
@Input() url: string;
|
||||
@Input() urls: string[];
|
||||
@Input() wrapX: boolean;
|
||||
|
||||
@ContentChild(FormatComponent) formatComponent: FormatComponent;
|
||||
format: format.Feature;
|
||||
@ContentChild(TileGridComponent) tileGridComponent: TileGridComponent;
|
||||
tileGrid: 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 source.VectorTile(this);
|
||||
this.host.instance.setSource(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,77 +0,0 @@
|
||||
import {
|
||||
Component,
|
||||
Host,
|
||||
Input,
|
||||
AfterContentInit,
|
||||
forwardRef,
|
||||
OnChanges,
|
||||
ContentChild,
|
||||
SimpleChanges,
|
||||
Optional,
|
||||
OnInit
|
||||
} from '@angular/core';
|
||||
import { source, Size, TileUrlFunctionType, TileLoadFunctionType, tilegrid } from 'openlayers';
|
||||
import { LayerTileComponent } from '../layers';
|
||||
import { SourceComponent } from './source.component';
|
||||
import { TileGridComponent } from '../tilegrid.component';
|
||||
import { SourceRasterComponent } from './raster.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 {
|
||||
instance: source.XYZ;
|
||||
@Input() cacheSize: number;
|
||||
@Input() crossOrigin: string;
|
||||
@Input() opaque: boolean;
|
||||
@Input() projection: string;
|
||||
@Input() reprojectionErrorThreshold: number;
|
||||
@Input() minZoom: number;
|
||||
@Input() maxZoom: number;
|
||||
@Input() tileGrid: tilegrid.TileGrid;
|
||||
@Input() tileLoadFunction?: TileLoadFunctionType;
|
||||
@Input() tilePixelRatio: number;
|
||||
@Input() tileSize: number|Size;
|
||||
@Input() tileUrlFunction: TileUrlFunctionType;
|
||||
@Input() url: string;
|
||||
@Input() urls: string[];
|
||||
@Input() wrapX: boolean;
|
||||
|
||||
@ContentChild(TileGridComponent) tileGridXYZ: TileGridComponent;
|
||||
|
||||
constructor(@Optional() @Host() layer: LayerTileComponent,
|
||||
@Optional() @Host() raster?: SourceRasterComponent) {
|
||||
super(layer, raster);
|
||||
}
|
||||
|
||||
ngAfterContentInit() {
|
||||
if (this.tileGridXYZ) {
|
||||
this.tileGrid = this.tileGridXYZ.instance;
|
||||
}
|
||||
this.instance = new source.XYZ(this);
|
||||
this._register(this.instance);
|
||||
}
|
||||
|
||||
ngOnChanges(changes: SimpleChanges) {
|
||||
let properties: {[index: string]: any} = {};
|
||||
|
||||
if (!this.instance) {
|
||||
return;
|
||||
}
|
||||
for (let key in changes) {
|
||||
if (changes.hasOwnProperty(key)) {
|
||||
properties[key] = changes[key].currentValue;
|
||||
}
|
||||
}
|
||||
|
||||
this.instance.setProperties(properties, false);
|
||||
if (changes.hasOwnProperty('url')) {
|
||||
this.instance = new source.XYZ(this);
|
||||
this._register(this.instance);
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,90 +0,0 @@
|
||||
import {
|
||||
Component, Directive, EventEmitter, Host, OnDestroy, OnChanges, AfterContentInit,
|
||||
Input, Output, ContentChild, SimpleChanges
|
||||
} from '@angular/core';
|
||||
import { style } from 'openlayers';
|
||||
import { FeatureComponent } from './feature.component';
|
||||
|
||||
@Directive({
|
||||
selector: 'aol-style-icon'
|
||||
})
|
||||
export class StyleIconDirective implements OnChanges {
|
||||
|
||||
// For usage info see: http://openlayers.org/en/latest/apidoc/ol.style.Icon.html
|
||||
@Input() anchor: [number, number];
|
||||
@Input() anchorXUnits: style.IconAnchorUnits;
|
||||
@Input() anchorYUnits: style.IconAnchorUnits;
|
||||
@Input() anchorOrigin: style.IconOrigin;
|
||||
@Input() color: [number, number, number, number];
|
||||
@Input() crossOrigin: style.IconOrigin;
|
||||
@Input() img: string;
|
||||
@Input() offset: [number, number];
|
||||
@Input() offsetOrigin: style.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;
|
||||
|
||||
@Output() onChanged = new EventEmitter<any>();
|
||||
|
||||
constructor() { }
|
||||
|
||||
ngOnChanges(changes: SimpleChanges) {
|
||||
this.onChanged.emit(this.src);
|
||||
}
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'aol-style',
|
||||
template: `<ng-content></ng-content>`
|
||||
})
|
||||
export class StyleComponent implements OnDestroy, AfterContentInit {
|
||||
private _host_: FeatureComponent;
|
||||
private childSubscription$: any;
|
||||
|
||||
@ContentChild(StyleIconDirective) iconStyleDirective: StyleIconDirective;
|
||||
|
||||
constructor( @Host() feature: FeatureComponent) {
|
||||
console.log('instancing aol-style');
|
||||
this._host_ = feature;
|
||||
}
|
||||
|
||||
ngAfterContentInit() {
|
||||
this.update();
|
||||
this.childSubscription$ = this.iconStyleDirective.onChanged.subscribe((): void => {
|
||||
this.update();
|
||||
});
|
||||
}
|
||||
|
||||
update() {
|
||||
this._host_.setStyle(new style.Style({
|
||||
image: new style.Icon({
|
||||
anchor: this.iconStyleDirective.anchor,
|
||||
anchorOrigin: this.iconStyleDirective.anchorOrigin,
|
||||
anchorXUnits: this.iconStyleDirective.anchorXUnits,
|
||||
anchorYUnits: this.iconStyleDirective.anchorYUnits,
|
||||
color: this.iconStyleDirective.color,
|
||||
crossOrigin: this.iconStyleDirective.crossOrigin,
|
||||
img: this.iconStyleDirective.img,
|
||||
offset: this.iconStyleDirective.offset,
|
||||
offsetOrigin: this.iconStyleDirective.offsetOrigin,
|
||||
opacity: this.iconStyleDirective.opacity,
|
||||
scale: this.iconStyleDirective.scale,
|
||||
snapToPixel: this.iconStyleDirective.snapToPixel,
|
||||
rotateWithView: this.iconStyleDirective.rotateWithView,
|
||||
rotation: this.iconStyleDirective.rotation,
|
||||
size: this.iconStyleDirective.size,
|
||||
imgSize: this.iconStyleDirective.imgSize,
|
||||
src: this.iconStyleDirective.src
|
||||
})
|
||||
}));
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
this.childSubscription$.unsubscribe();
|
||||
}
|
||||
}
|
||||
@ -1,56 +0,0 @@
|
||||
import { Component, Input, Host, AfterContentInit, OnChanges, OnDestroy, SimpleChanges } from '@angular/core';
|
||||
import { style } from 'openlayers';
|
||||
import { StyleComponent } from './style.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-style-circle',
|
||||
template: `<ng-content></ng-content>`
|
||||
})
|
||||
export class StyleCircleComponent implements AfterContentInit, OnChanges, OnDestroy {
|
||||
public componentType: string = 'style-circle';
|
||||
public instance: style.Circle;
|
||||
|
||||
@Input() fill: style.Fill;
|
||||
@Input() radius: number;
|
||||
@Input() snapToPixel: boolean;
|
||||
@Input() stroke: style.Stroke;
|
||||
@Input() atlasManager: style.AtlasManager;
|
||||
|
||||
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 style.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,67 +0,0 @@
|
||||
import { Component, Input, Optional, OnInit, OnChanges, SimpleChanges } from '@angular/core';
|
||||
import { style, Color, ColorLike } from 'openlayers';
|
||||
import { StyleComponent } from './style.component';
|
||||
import { StyleCircleComponent } from './circle.component';
|
||||
import { StyleTextComponent } from './text.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-style-fill',
|
||||
template: `<div class="aol-style-fill"></div>`,
|
||||
})
|
||||
export class StyleFillComponent implements OnInit, OnChanges {
|
||||
/* the typings do not have the setters */
|
||||
private host: /*StyleComponent|StyleCircleComponent|StyleTextComponent*/any;
|
||||
public instance: style.Fill;
|
||||
|
||||
@Input() color: Color|ColorLike;
|
||||
|
||||
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 style.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.fill = this.instance;
|
||||
// console.log('setting ol.style.circle instance\'s fill:', 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);
|
||||
}
|
||||
this.host.update();
|
||||
// console.log('changes detected in aol-style-fill, setting new color: ', changes);
|
||||
}
|
||||
}
|
||||
@ -1,60 +0,0 @@
|
||||
import { Component, Input, Host, OnInit, OnChanges, SimpleChanges } from '@angular/core';
|
||||
import { style } from 'openlayers';
|
||||
import { StyleComponent } from './style.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-style-icon',
|
||||
template: `<div class="aol-style-icon"></div>`,
|
||||
})
|
||||
export class StyleIconComponent implements OnInit, OnChanges {
|
||||
public instance: style.Icon;
|
||||
|
||||
@Input() anchor: [number, number];
|
||||
@Input() anchorXUnits: style.IconAnchorUnits;
|
||||
@Input() anchorYUnits: style.IconAnchorUnits;
|
||||
@Input() anchorOrigin: style.IconOrigin;
|
||||
@Input() color: [number, number, number, number];
|
||||
@Input() crossOrigin: style.IconOrigin;
|
||||
@Input() img: string;
|
||||
@Input() offset: [number, number];
|
||||
@Input() offsetOrigin: style.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;
|
||||
|
||||
|
||||
constructor(@Host() private host: StyleComponent) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
// console.log('creating ol.style.Icon instance with: ', this);
|
||||
this.instance = new style.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 style.Icon(this);
|
||||
this.host.instance.setImage(this.instance);
|
||||
}
|
||||
this.host.update();
|
||||
// console.log('changes detected in aol-style-icon: ', changes);
|
||||
}
|
||||
}
|
||||
@ -1,6 +0,0 @@
|
||||
export * from './circle.component';
|
||||
export * from './fill.component';
|
||||
export * from './icon.component';
|
||||
export * from './stroke.component';
|
||||
export * from './style.component';
|
||||
export * from './text.component';
|
||||
@ -1,87 +0,0 @@
|
||||
import { Component, Input, Optional, OnInit, OnChanges, SimpleChanges } from '@angular/core';
|
||||
import { style, Color } from 'openlayers';
|
||||
import { StyleComponent } from './style.component';
|
||||
import { StyleCircleComponent } from './circle.component';
|
||||
import { StyleTextComponent } from './text.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-style-stroke',
|
||||
template: `<div class="aol-style-stroke"></div>`,
|
||||
})
|
||||
export class StyleStrokeComponent implements OnInit, OnChanges {
|
||||
public instance: style.Stroke;
|
||||
/* the typings do not have the setters */
|
||||
private host: /*StyleComponent|StyleCircleComponent|StyleTextComponent*/any;
|
||||
|
||||
@Input() color: Color|undefined;
|
||||
@Input() lineCap: string|undefined;
|
||||
@Input() lineDash: number[]|undefined;
|
||||
@Input() lineJoin: string|undefined;
|
||||
@Input() miterLimit: number|undefined;
|
||||
@Input() width: number|undefined;
|
||||
|
||||
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 style.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.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,43 +0,0 @@
|
||||
import { Component, Input, Optional, OnInit } from '@angular/core';
|
||||
import { style, StyleGeometryFunction, geom } from 'openlayers';
|
||||
import { FeatureComponent } from '../feature.component';
|
||||
import { LayerVectorComponent } from '../layers';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-style',
|
||||
template: `<ng-content></ng-content>`
|
||||
})
|
||||
export class StyleComponent implements OnInit {
|
||||
private host: FeatureComponent|LayerVectorComponent;
|
||||
public instance: style.Style;
|
||||
public componentType: string = 'style';
|
||||
|
||||
@Input() geometry: string | geom.Geometry | StyleGeometryFunction;
|
||||
@Input() fill: style.Fill;
|
||||
@Input() image: style.Image;
|
||||
@Input() stroke: style.Stroke;
|
||||
@Input() text: style.Text;
|
||||
@Input() zIndex: number;
|
||||
|
||||
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.Style(this);
|
||||
this.host.instance.setStyle(this.instance);
|
||||
}
|
||||
}
|
||||
@ -1,67 +0,0 @@
|
||||
import { Component, Input, Optional, OnInit, OnChanges, SimpleChanges } from '@angular/core';
|
||||
import { style } from 'openlayers';
|
||||
import { StyleComponent } from './style.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-style-text',
|
||||
template: `<div class="aol-style-text"></div>`,
|
||||
})
|
||||
export class StyleTextComponent implements OnInit, OnChanges {
|
||||
public instance: style.Text;
|
||||
public componentType: string = 'style-text';
|
||||
|
||||
@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: string|undefined;
|
||||
@Input() textBaseLine: string|undefined;
|
||||
|
||||
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 style.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);
|
||||
}
|
||||
}
|
||||
@ -1,33 +0,0 @@
|
||||
import { Component, Input, OnChanges, OnInit, SimpleChanges } from '@angular/core';
|
||||
import { tilegrid, Extent, Size , Coordinate} from 'openlayers';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-tilegrid',
|
||||
template: ''
|
||||
})
|
||||
export class TileGridComponent implements OnInit, OnChanges {
|
||||
instance: tilegrid.TileGrid;
|
||||
|
||||
@Input() extent: Extent;
|
||||
@Input() maxZoom: number;
|
||||
@Input() minZoom: number;
|
||||
@Input() tileSize: number|Size;
|
||||
@Input() origin?: Coordinate;
|
||||
@Input() resolutions: number[];
|
||||
|
||||
ngOnInit() {
|
||||
if (!this.resolutions) {
|
||||
this.instance = tilegrid.createXYZ(this)
|
||||
} else {
|
||||
this.instance = new tilegrid.TileGrid(this);
|
||||
}
|
||||
}
|
||||
|
||||
ngOnChanges(changes: SimpleChanges) {
|
||||
if (!this.resolutions) {
|
||||
this.instance = tilegrid.createXYZ(this)
|
||||
} else {
|
||||
this.instance = new tilegrid.TileGrid(this);
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,23 +0,0 @@
|
||||
import { Component, Input, OnInit } from '@angular/core';
|
||||
import { tilegrid, Extent, Size, Coordinate } from 'openlayers';
|
||||
import { TileGridComponent } from './tilegrid.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-tilegrid-wmts',
|
||||
template: ''
|
||||
})
|
||||
export class TileGridWMTSComponent extends TileGridComponent implements OnInit {
|
||||
instance: tilegrid.WMTS;
|
||||
|
||||
@Input() origin?: Coordinate;
|
||||
@Input() origins?: Coordinate[];
|
||||
@Input() resolutions: number[];
|
||||
@Input() matrixIds: string[];
|
||||
@Input() sizes?: Size[];
|
||||
@Input() tileSizes?: ((number | Size)[]);
|
||||
@Input() widths?: number[];
|
||||
|
||||
ngOnInit() {
|
||||
this.instance = new tilegrid.WMTS(this);
|
||||
}
|
||||
}
|
||||
@ -1,68 +0,0 @@
|
||||
import { Component, Input, OnInit, OnChanges, OnDestroy, SimpleChanges } from '@angular/core';
|
||||
import { View, Extent, Coordinate } from 'openlayers';
|
||||
import { MapComponent } from './map.component';
|
||||
|
||||
@Component({
|
||||
selector: 'aol-view',
|
||||
template: `<ng-content></ng-content>`
|
||||
})
|
||||
export class ViewComponent implements OnInit, OnChanges, OnDestroy {
|
||||
public instance: View;
|
||||
public componentType: string = 'view';
|
||||
|
||||
@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() zoomAnimation = false;
|
||||
|
||||
constructor(private host: MapComponent) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
// console.log('creating ol.View instance with: ', this);
|
||||
this.instance = new View(this);
|
||||
this.host.instance.setView(this.instance);
|
||||
}
|
||||
|
||||
ngOnChanges(changes: SimpleChanges) {
|
||||
let properties: { [index: string]: any } = {};
|
||||
if (!this.instance) {
|
||||
return;
|
||||
}
|
||||
for (let 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;
|
||||
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 +0,0 @@
|
||||
export const MODULE_NAME = "FarmMapsCommonAol";
|
||||
@ -1,5 +0,0 @@
|
||||
/*
|
||||
* Public API Surface of common-aol
|
||||
*/
|
||||
|
||||
export * from './fm-aol/common-aol.module';
|
||||
@ -1,30 +0,0 @@
|
||||
{
|
||||
"extends": "../../tsconfig.json",
|
||||
"compilerOptions": {
|
||||
"outDir": "../../out-tsc/lib",
|
||||
"module": "es2015",
|
||||
"moduleResolution": "node",
|
||||
"declaration": true,
|
||||
"sourceMap": true,
|
||||
"inlineSources": true,
|
||||
"emitDecoratorMetadata": true,
|
||||
"experimentalDecorators": true,
|
||||
"importHelpers": true,
|
||||
"types": [],
|
||||
"lib": [
|
||||
"dom",
|
||||
"es2018"
|
||||
]
|
||||
},
|
||||
"angularCompilerOptions": {
|
||||
"skipTemplateCodegen": true,
|
||||
"strictMetadataEmit": true,
|
||||
"fullTemplateTypeCheck": true,
|
||||
"strictInjectionParameters": true,
|
||||
"enableResourceInlining": true
|
||||
},
|
||||
"exclude": [
|
||||
"src/test.ts",
|
||||
"**/*.spec.ts"
|
||||
]
|
||||
}
|
||||
@ -1,39 +0,0 @@
|
||||
{
|
||||
"extends": "../../tsconfig.json",
|
||||
"compilerOptions": {
|
||||
"outDir": "../../out-tsc/lib",
|
||||
"module": "es2015",
|
||||
"moduleResolution": "node",
|
||||
"declaration": true,
|
||||
"sourceMap": true,
|
||||
"inlineSources": true,
|
||||
"emitDecoratorMetadata": true,
|
||||
"experimentalDecorators": true,
|
||||
"importHelpers": true,
|
||||
"esModuleInterop": true,
|
||||
"types": [],
|
||||
"lib": [
|
||||
"dom",
|
||||
"es2018"
|
||||
],
|
||||
"paths": {
|
||||
"@angular/*": [
|
||||
|
||||
"node_modules/@angular/*"
|
||||
|
||||
]
|
||||
}
|
||||
},
|
||||
"angularCompilerOptions": {
|
||||
"skipTemplateCodegen": true,
|
||||
"strictMetadataEmit": true,
|
||||
"fullTemplateTypeCheck": true,
|
||||
"strictInjectionParameters": true,
|
||||
"enableResourceInlining": true,
|
||||
"compilationMode": "partial"
|
||||
},
|
||||
"exclude": [
|
||||
"src/test.ts",
|
||||
"**/*.spec.ts"
|
||||
]
|
||||
}
|
||||
@ -1,17 +0,0 @@
|
||||
{
|
||||
"extends": "../../tsconfig.json",
|
||||
"compilerOptions": {
|
||||
"outDir": "../../out-tsc/spec",
|
||||
"types": [
|
||||
"jasmine",
|
||||
"node"
|
||||
]
|
||||
},
|
||||
"files": [
|
||||
"src/test.ts"
|
||||
],
|
||||
"include": [
|
||||
"**/*.spec.ts",
|
||||
"**/*.d.ts"
|
||||
]
|
||||
}
|
||||
@ -1,100 +0,0 @@
|
||||
{
|
||||
"rulesDirectory": [
|
||||
"node_modules/codelyzer"
|
||||
],
|
||||
"rules": {
|
||||
"class-name": true,
|
||||
"comment-format": [
|
||||
true,
|
||||
"check-space"
|
||||
],
|
||||
"curly": true,
|
||||
"eofline": true,
|
||||
"forin": true,
|
||||
"indent": [
|
||||
true,
|
||||
"spaces"
|
||||
],
|
||||
"label-position": true,
|
||||
"max-line-length": [
|
||||
true,
|
||||
140
|
||||
],
|
||||
"member-access": false,
|
||||
"member-ordering": [
|
||||
true,
|
||||
"static-before-instance",
|
||||
"variables-before-functions"
|
||||
],
|
||||
"no-arg": true,
|
||||
"no-bitwise": true,
|
||||
"no-console": [
|
||||
true,
|
||||
"debug",
|
||||
"info",
|
||||
"time",
|
||||
"timeEnd",
|
||||
"trace"
|
||||
],
|
||||
"no-construct": true,
|
||||
"no-debugger": true,
|
||||
"no-duplicate-variable": true,
|
||||
"no-empty": false,
|
||||
"no-eval": true,
|
||||
"no-inferrable-types": true,
|
||||
"no-shadowed-variable": true,
|
||||
"no-string-literal": false,
|
||||
"no-switch-case-fall-through": true,
|
||||
"no-trailing-whitespace": true,
|
||||
"no-use-before-declare": true,
|
||||
"no-var-keyword": true,
|
||||
"object-literal-sort-keys": false,
|
||||
"one-line": [
|
||||
true,
|
||||
"check-open-brace",
|
||||
"check-catch",
|
||||
"check-else",
|
||||
"check-whitespace"
|
||||
],
|
||||
"quotemark": [
|
||||
true,
|
||||
"single"
|
||||
],
|
||||
"radix": true,
|
||||
"semicolon": [
|
||||
"always"
|
||||
],
|
||||
"triple-equals": [
|
||||
true,
|
||||
"allow-null-check"
|
||||
],
|
||||
"typedef-whitespace": [
|
||||
true,
|
||||
{
|
||||
"call-signature": "nospace",
|
||||
"index-signature": "nospace",
|
||||
"parameter": "nospace",
|
||||
"property-declaration": "nospace",
|
||||
"variable-declaration": "nospace"
|
||||
}
|
||||
],
|
||||
"variable-name": false,
|
||||
"whitespace": [
|
||||
true,
|
||||
"check-branch",
|
||||
"check-decl",
|
||||
"check-operator",
|
||||
"check-separator",
|
||||
"check-type"
|
||||
],
|
||||
"use-input-property-decorator": true,
|
||||
"use-output-property-decorator": true,
|
||||
"use-host-property-decorator": true,
|
||||
"no-input-rename": true,
|
||||
"no-output-rename": true,
|
||||
"use-life-cycle-interface": true,
|
||||
"use-pipe-transform-interface": true,
|
||||
"component-class-suffix": true,
|
||||
"directive-class-suffix": true
|
||||
}
|
||||
}
|
||||
15
projects/common-map/package-lock.json
generated
15
projects/common-map/package-lock.json
generated
@ -1,21 +1,22 @@
|
||||
{
|
||||
"name": "@farmmaps/common-map",
|
||||
"version": "2.1.0",
|
||||
"version": "2.0.0",
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "@farmmaps/common-map",
|
||||
"version": "2.1.0",
|
||||
"version": "2.0.0",
|
||||
"dependencies": {
|
||||
"tslib": "^2.0.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@angular/core": ">=16.0.0",
|
||||
"@ngrx/effects": ">=16.0.0",
|
||||
"@ngrx/router-store": ">=16.0.0",
|
||||
"@ngrx/store": ">=16.0.0",
|
||||
"ngrx-store-localstorage": ">=16.0.0",
|
||||
"@angular/core": ">=14.0.0",
|
||||
"@ngrx/effects": ">=14.0.0",
|
||||
"@ngrx/router-store": ">=14.0.0",
|
||||
"@ngrx/store": ">=14.0.0",
|
||||
"ngrx-store-localstorage": ">=14.0.0",
|
||||
"ngx-openlayers": ">=1.0.0-next.19",
|
||||
"ol": ">=6.8.1",
|
||||
"tassign": ">=1.0.0"
|
||||
}
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@farmmaps/common-map",
|
||||
"version": "2.1.0",
|
||||
"version": "2.0.0",
|
||||
"publishConfig": {
|
||||
"registry": "https://repository.akkerweb.nl/repository/npm-hosted/"
|
||||
},
|
||||
@ -8,12 +8,13 @@
|
||||
"tslib": "^2.0.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@angular/core": ">=16.0.0",
|
||||
"ngrx-store-localstorage": ">=16.0.0",
|
||||
"@ngrx/effects": ">=16.0.0",
|
||||
"@ngrx/router-store":">=16.0.0",
|
||||
"@ngrx/store":">=16.0.0",
|
||||
"@angular/core": ">=14.0.0",
|
||||
"ngrx-store-localstorage": ">=14.0.0",
|
||||
"@ngrx/effects": ">=14.0.0",
|
||||
"@ngrx/router-store":">=14.0.0",
|
||||
"@ngrx/store":">=14.0.0",
|
||||
"tassign": ">=1.0.0",
|
||||
"ngx-openlayers": ">=1.0.0-next.19",
|
||||
"ol": ">=6.8.1"
|
||||
}
|
||||
}
|
||||
|
||||
@ -3,7 +3,7 @@ import { CommonModule } from '@angular/common';
|
||||
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
|
||||
|
||||
//external modules
|
||||
import { AppCommonAolModule } from '@farmmaps/common-aol';
|
||||
import { AngularOpenlayersModule } from 'ngx-openlayers';
|
||||
import { StoreModule, ActionReducer, MetaReducer } from '@ngrx/store';
|
||||
import { EffectsModule } from '@ngrx/effects';
|
||||
import { NgbModule } from "@ng-bootstrap/ng-bootstrap";
|
||||
@ -172,7 +172,7 @@ export {
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
AppCommonAolModule,
|
||||
AngularOpenlayersModule,
|
||||
MapRoutingModule,
|
||||
StoreModule.forFeature(MODULE_NAME, mapReducers.reducer, { metaReducers: metaReducers }),
|
||||
EffectsModule.forFeature([mapEffects.MapEffects]),
|
||||
|
||||
@ -1,3 +1,6 @@
|
||||
@import "~bootstrap/scss/bootstrap.scss";
|
||||
|
||||
|
||||
.gps-location {
|
||||
display:none;
|
||||
}
|
||||
@ -11,7 +14,7 @@
|
||||
}
|
||||
|
||||
.tolerance {
|
||||
fill: var(--bs-primary);
|
||||
fill: $primary;
|
||||
fill-opacity:0.4;
|
||||
}
|
||||
|
||||
@ -20,20 +23,20 @@
|
||||
}
|
||||
|
||||
.border {
|
||||
fill: var(--bs-white);
|
||||
fill: $white;
|
||||
}
|
||||
|
||||
.center {
|
||||
fill: var(--bs-primary);
|
||||
fill: $primary;
|
||||
}
|
||||
|
||||
.stop1 {
|
||||
stop-color: var(--bs-primary);
|
||||
stop-color: $primary;
|
||||
stop-opacity:1;
|
||||
}
|
||||
|
||||
.stop2 {
|
||||
stop-color: var(--bs-primary);
|
||||
stop-color:$primary;
|
||||
stop-opacity: 0;
|
||||
}
|
||||
|
||||
|
||||
@ -1,8 +1,11 @@
|
||||
@import "~bootstrap/scss/bootstrap.scss";
|
||||
|
||||
|
||||
.gps-location {
|
||||
display:block;
|
||||
width:2.5em;
|
||||
height:2.5em;
|
||||
background-color: var(--bs-body-bg);
|
||||
background-color: $body-bg;
|
||||
background-size: contain;
|
||||
margin-top:0.5em;
|
||||
border-radius: 1.75em;
|
||||
@ -14,15 +17,15 @@
|
||||
}
|
||||
|
||||
.pan-to {
|
||||
fill: var(--bs-secondary);
|
||||
fill: $secondary;
|
||||
}
|
||||
|
||||
div.gps-location:hover .pan-to {
|
||||
fill: var(--bs-white);
|
||||
fill: $white;
|
||||
}
|
||||
|
||||
.pan-to-centered {
|
||||
fill: var(--bs-primary);
|
||||
fill: $primary;
|
||||
}
|
||||
|
||||
div.gps-location:hover .pan-to-centered {
|
||||
@ -30,5 +33,5 @@ div.gps-location:hover .pan-to-centered {
|
||||
}
|
||||
|
||||
.pan-to.pan-to-disabled {
|
||||
fill: var(--bs-gray-300);
|
||||
fill: $gray-300;
|
||||
}
|
||||
|
||||
@ -1,3 +1,5 @@
|
||||
@import "~bootstrap/scss/bootstrap.scss";
|
||||
|
||||
.compass {
|
||||
width:2.5em;
|
||||
height:2.5em;
|
||||
@ -11,7 +13,7 @@
|
||||
|
||||
#north {
|
||||
display: none;
|
||||
fill: var(--bs-black);
|
||||
fill:$black;
|
||||
}
|
||||
|
||||
#top-l {
|
||||
@ -31,23 +33,23 @@
|
||||
}
|
||||
|
||||
div.compass:hover #top-l {
|
||||
fill: var(--bs-white);
|
||||
fill:$white;
|
||||
}
|
||||
|
||||
div.compass:hover #top-r {
|
||||
fill: var(--bs-gray-300);
|
||||
fill:$gray-300;
|
||||
}
|
||||
|
||||
div.compass:hover #bottom-l {
|
||||
fill: var(--bs-gray-300);
|
||||
fill:$gray-300;
|
||||
}
|
||||
|
||||
div.compass:hover #bottom-r {
|
||||
fill: var(--bs-white);
|
||||
fill:$white;
|
||||
}
|
||||
|
||||
div.compass:hover #north {
|
||||
fill: var(--bs-white);
|
||||
fill:$white;
|
||||
}
|
||||
|
||||
.compass-n {
|
||||
|
||||
@ -1,10 +1,14 @@
|
||||
@import "~bootstrap/scss/bootstrap.scss";
|
||||
|
||||
|
||||
|
||||
.row {
|
||||
border-bottom: 1px solid var(--bs-gray-500);
|
||||
border-bottom: 1px solid $gray-500;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.row.selected {
|
||||
background-color: var(--bs-gray-100);
|
||||
background-color: $gray-100;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 44rem) {
|
||||
|
||||
@ -1,20 +1,22 @@
|
||||
@import "~bootstrap/scss/bootstrap.scss";
|
||||
|
||||
fm-map-feature-list-feature-container {
|
||||
width:100%;
|
||||
pointer-events:none;
|
||||
}
|
||||
|
||||
.row {
|
||||
border-bottom: 1px solid var(--bs-gray-500);
|
||||
border-bottom: 1px solid $gray-500;
|
||||
user-select: none;
|
||||
padding-left:1.5rem;
|
||||
}
|
||||
|
||||
.row.selected {
|
||||
background-color: var(--bs-gray-100);
|
||||
background-color: $gray-100;
|
||||
}
|
||||
|
||||
.cropfields {
|
||||
border-top: 1px solid var(--bs-gray-500);
|
||||
border-top: 1px solid $gray-500;
|
||||
margin-left: -1.25rem;
|
||||
margin-right: -1.25rem;
|
||||
}
|
||||
|
||||
@ -1,20 +1,22 @@
|
||||
@import "~bootstrap/scss/bootstrap.scss";
|
||||
|
||||
fm-map-feature-list-feature-container {
|
||||
width:100%;
|
||||
pointer-events:none;
|
||||
}
|
||||
|
||||
.row {
|
||||
border-bottom: 1px solid var(--bs-gray-500);
|
||||
border-bottom: 1px solid $gray-500;
|
||||
user-select: none;
|
||||
padding-left:1.5rem;
|
||||
}
|
||||
|
||||
.row.selected {
|
||||
background-color: var(--bs-gray-100);
|
||||
background-color: $gray-100;
|
||||
}
|
||||
|
||||
.farms {
|
||||
border-top: 1px solid var(--bs-gray-500);
|
||||
border-top: 1px solid $gray-500;
|
||||
margin-left: -1.25rem;
|
||||
margin-right: -1.25rem;
|
||||
}
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue
Block a user