@angular-helpers/openlayers 0.3.0 → 0.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +102 -6
- package/fesm2022/angular-helpers-openlayers-controls.mjs +289 -36
- package/fesm2022/angular-helpers-openlayers-core.mjs +215 -16
- package/fesm2022/angular-helpers-openlayers-interactions.mjs +426 -23
- package/fesm2022/angular-helpers-openlayers-layers.mjs +717 -38
- package/fesm2022/angular-helpers-openlayers-military.mjs +329 -12
- package/fesm2022/angular-helpers-openlayers-overlays.mjs +11 -10
- package/package.json +6 -2
- package/types/angular-helpers-openlayers-controls.d.ts +24 -4
- package/types/angular-helpers-openlayers-core.d.ts +143 -4
- package/types/angular-helpers-openlayers-interactions.d.ts +127 -23
- package/types/angular-helpers-openlayers-layers.d.ts +194 -35
- package/types/angular-helpers-openlayers-military.d.ts +160 -16
|
@@ -1,12 +1,20 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { inject, input, DestroyRef, afterNextRender, ChangeDetectionStrategy, Component, InjectionToken, output, signal, Injectable } from '@angular/core';
|
|
2
|
+
import { inject, input, DestroyRef, afterNextRender, ChangeDetectionStrategy, Component, InjectionToken, output, signal, ViewChild, Injectable } from '@angular/core';
|
|
3
3
|
import { OlMapService, OlZoneHelper } from '@angular-helpers/openlayers/core';
|
|
4
4
|
import Zoom from 'ol/control/Zoom';
|
|
5
5
|
import Attribution from 'ol/control/Attribution';
|
|
6
6
|
import ScaleLine from 'ol/control/ScaleLine';
|
|
7
7
|
import FullScreen from 'ol/control/FullScreen';
|
|
8
8
|
import Rotate from 'ol/control/Rotate';
|
|
9
|
+
import * as i1 from '@angular/common';
|
|
9
10
|
import { CommonModule } from '@angular/common';
|
|
11
|
+
import Control from 'ol/control/Control';
|
|
12
|
+
import Geolocation from 'ol/Geolocation';
|
|
13
|
+
import Feature from 'ol/Feature';
|
|
14
|
+
import Point from 'ol/geom/Point';
|
|
15
|
+
import { Vector as Vector$1 } from 'ol/layer';
|
|
16
|
+
import { Vector } from 'ol/source';
|
|
17
|
+
import { Style, Circle, Stroke, Fill } from 'ol/style';
|
|
10
18
|
|
|
11
19
|
// OlZoomControlComponent
|
|
12
20
|
class OlZoomControlComponent {
|
|
@@ -38,10 +46,10 @@ class OlZoomControlComponent {
|
|
|
38
46
|
});
|
|
39
47
|
});
|
|
40
48
|
}
|
|
41
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
42
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
49
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: OlZoomControlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
50
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.13", type: OlZoomControlComponent, isStandalone: true, selector: "ol-zoom-control", inputs: { delta: { classPropertyName: "delta", publicName: "delta", isSignal: true, isRequired: false, transformFunction: null }, duration: { classPropertyName: "duration", publicName: "duration", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
43
51
|
}
|
|
44
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
52
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: OlZoomControlComponent, decorators: [{
|
|
45
53
|
type: Component,
|
|
46
54
|
args: [{
|
|
47
55
|
selector: 'ol-zoom-control',
|
|
@@ -83,10 +91,10 @@ class OlAttributionControlComponent {
|
|
|
83
91
|
});
|
|
84
92
|
});
|
|
85
93
|
}
|
|
86
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
87
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
94
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: OlAttributionControlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
95
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.13", type: OlAttributionControlComponent, isStandalone: true, selector: "ol-attribution-control", inputs: { collapsible: { classPropertyName: "collapsible", publicName: "collapsible", isSignal: true, isRequired: false, transformFunction: null }, collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
88
96
|
}
|
|
89
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
97
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: OlAttributionControlComponent, decorators: [{
|
|
90
98
|
type: Component,
|
|
91
99
|
args: [{
|
|
92
100
|
selector: 'ol-attribution-control',
|
|
@@ -130,10 +138,10 @@ class OlScaleLineControlComponent {
|
|
|
130
138
|
});
|
|
131
139
|
});
|
|
132
140
|
}
|
|
133
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
134
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
141
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: OlScaleLineControlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
142
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.13", type: OlScaleLineControlComponent, isStandalone: true, selector: "ol-scale-line-control", inputs: { units: { classPropertyName: "units", publicName: "units", isSignal: true, isRequired: false, transformFunction: null }, bar: { classPropertyName: "bar", publicName: "bar", isSignal: true, isRequired: false, transformFunction: null }, steps: { classPropertyName: "steps", publicName: "steps", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
135
143
|
}
|
|
136
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
144
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: OlScaleLineControlComponent, decorators: [{
|
|
137
145
|
type: Component,
|
|
138
146
|
args: [{
|
|
139
147
|
selector: 'ol-scale-line-control',
|
|
@@ -179,10 +187,10 @@ class OlFullscreenControlComponent {
|
|
|
179
187
|
});
|
|
180
188
|
});
|
|
181
189
|
}
|
|
182
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
183
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
190
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: OlFullscreenControlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
191
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.13", type: OlFullscreenControlComponent, isStandalone: true, selector: "ol-fullscreen-control", inputs: { source: { classPropertyName: "source", publicName: "source", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, labelActive: { classPropertyName: "labelActive", publicName: "labelActive", isSignal: true, isRequired: false, transformFunction: null }, tipLabel: { classPropertyName: "tipLabel", publicName: "tipLabel", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
184
192
|
}
|
|
185
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
193
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: OlFullscreenControlComponent, decorators: [{
|
|
186
194
|
type: Component,
|
|
187
195
|
args: [{
|
|
188
196
|
selector: 'ol-fullscreen-control',
|
|
@@ -236,10 +244,10 @@ class OlRotateControlComponent {
|
|
|
236
244
|
});
|
|
237
245
|
});
|
|
238
246
|
}
|
|
239
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
240
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.
|
|
247
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: OlRotateControlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
248
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.13", type: OlRotateControlComponent, isStandalone: true, selector: "ol-rotate-control", inputs: { autoHide: { classPropertyName: "autoHide", publicName: "autoHide", isSignal: true, isRequired: false, transformFunction: null }, duration: { classPropertyName: "duration", publicName: "duration", isSignal: true, isRequired: false, transformFunction: null }, tipLabel: { classPropertyName: "tipLabel", publicName: "tipLabel", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
241
249
|
}
|
|
242
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
250
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: OlRotateControlComponent, decorators: [{
|
|
243
251
|
type: Component,
|
|
244
252
|
args: [{
|
|
245
253
|
selector: 'ol-rotate-control',
|
|
@@ -270,10 +278,13 @@ class OlLayerSwitcherComponent {
|
|
|
270
278
|
layers = input([], ...(ngDevMode ? [{ debugName: "layers" }] : /* istanbul ignore next */ []));
|
|
271
279
|
collapsible = input(true, ...(ngDevMode ? [{ debugName: "collapsible" }] : /* istanbul ignore next */ []));
|
|
272
280
|
showOpacity = input(false, ...(ngDevMode ? [{ debugName: "showOpacity" }] : /* istanbul ignore next */ []));
|
|
273
|
-
startCollapsed = input(
|
|
281
|
+
startCollapsed = input(true, ...(ngDevMode ? [{ debugName: "startCollapsed" }] : /* istanbul ignore next */ []));
|
|
274
282
|
visibilityChange = output();
|
|
275
283
|
opacityChange = output();
|
|
276
|
-
isCollapsed = signal(
|
|
284
|
+
isCollapsed = signal(true, ...(ngDevMode ? [{ debugName: "isCollapsed" }] : /* istanbul ignore next */ []));
|
|
285
|
+
ngOnInit() {
|
|
286
|
+
this.isCollapsed.set(this.startCollapsed());
|
|
287
|
+
}
|
|
277
288
|
toggleCollapsed() {
|
|
278
289
|
if (this.collapsible()) {
|
|
279
290
|
this.isCollapsed.update((v) => !v);
|
|
@@ -289,8 +300,8 @@ class OlLayerSwitcherComponent {
|
|
|
289
300
|
const value = event.target.valueAsNumber;
|
|
290
301
|
this.opacityChange.emit({ id, opacity: value });
|
|
291
302
|
}
|
|
292
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
293
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
303
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: OlLayerSwitcherComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
304
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: OlLayerSwitcherComponent, isStandalone: true, selector: "ol-layer-switcher", inputs: { position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, layers: { classPropertyName: "layers", publicName: "layers", isSignal: true, isRequired: false, transformFunction: null }, collapsible: { classPropertyName: "collapsible", publicName: "collapsible", isSignal: true, isRequired: false, transformFunction: null }, showOpacity: { classPropertyName: "showOpacity", publicName: "showOpacity", isSignal: true, isRequired: false, transformFunction: null }, startCollapsed: { classPropertyName: "startCollapsed", publicName: "startCollapsed", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { visibilityChange: "visibilityChange", opacityChange: "opacityChange" }, ngImport: i0, template: `
|
|
294
305
|
<div
|
|
295
306
|
class="ol-layer-switcher"
|
|
296
307
|
[class.collapsed]="isCollapsed()"
|
|
@@ -306,7 +317,22 @@ class OlLayerSwitcherComponent {
|
|
|
306
317
|
[attr.aria-expanded]="!isCollapsed()"
|
|
307
318
|
aria-label="Toggle layer switcher"
|
|
308
319
|
>
|
|
309
|
-
<span class="ol-layer-switcher__icon"
|
|
320
|
+
<span class="ol-layer-switcher__icon"
|
|
321
|
+
><svg
|
|
322
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
323
|
+
width="14"
|
|
324
|
+
height="14"
|
|
325
|
+
viewBox="0 0 24 24"
|
|
326
|
+
fill="none"
|
|
327
|
+
stroke="currentColor"
|
|
328
|
+
stroke-width="2.5"
|
|
329
|
+
stroke-linecap="round"
|
|
330
|
+
stroke-linejoin="round"
|
|
331
|
+
>
|
|
332
|
+
<polygon points="12 2 2 7 12 12 22 7 12 2"></polygon>
|
|
333
|
+
<polyline points="2 17 12 22 22 17"></polyline>
|
|
334
|
+
<polyline points="2 12 12 17 22 12"></polyline></svg
|
|
335
|
+
></span>
|
|
310
336
|
<span class="ol-layer-switcher__title">Layers</span>
|
|
311
337
|
</button>
|
|
312
338
|
|
|
@@ -357,9 +383,9 @@ class OlLayerSwitcherComponent {
|
|
|
357
383
|
</div>
|
|
358
384
|
}
|
|
359
385
|
</div>
|
|
360
|
-
`, isInline: true, styles: [":host{display:block}.ol-layer-switcher{position:absolute;background:#
|
|
386
|
+
`, isInline: true, styles: [":host{display:block}.ol-layer-switcher{position:absolute;background:#fffffff2;color:#333;border-radius:4px;border:none;box-shadow:0 1px 4px #0000004d;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:13px;min-width:36px;z-index:10;transition:all .2s ease}.ol-layer-switcher--top-left{top:.5em;left:.5em}.ol-layer-switcher--top-right{top:10em;right:.5em}.ol-layer-switcher--bottom-left{bottom:.5em;left:.5em}.ol-layer-switcher--bottom-right{bottom:.5em;right:.5em}.ol-layer-switcher.collapsed{min-width:auto}.ol-layer-switcher__toggle{display:flex;align-items:center;gap:6px;padding:4px 8px;background:transparent;color:#333;border:none;border-bottom:1px solid rgba(0,0,0,.08);border-radius:4px 4px 0 0;cursor:pointer;width:100%;font-size:13px;font-weight:600;transition:background .15s ease;min-height:36px}.ol-layer-switcher.collapsed .ol-layer-switcher__toggle{border-bottom:none;border-radius:4px;padding:4px 6px;justify-content:center}.ol-layer-switcher__toggle:hover{background:#0000000d}.ol-layer-switcher__icon{font-size:14px;line-height:1}.ol-layer-switcher__title{font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.5px}.ol-layer-switcher.collapsed .ol-layer-switcher__title,.ol-layer-switcher.collapsed .ol-layer-switcher__panel{display:none}.ol-layer-switcher__panel{padding:6px;max-height:300px;overflow-y:auto}.ol-layer-switcher__empty{padding:12px;color:#6b7280;text-align:center;font-style:italic;font-size:12px}.ol-layer-switcher__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}.ol-layer-switcher__item{padding:5px 8px;border-radius:3px;transition:background .15s ease}.ol-layer-switcher__item:hover{background:#0000000a}.ol-layer-switcher__label{display:flex;align-items:center;gap:6px;cursor:pointer;font-size:12px}.ol-layer-switcher__checkbox{cursor:pointer;accent-color:#1a73e8}.ol-layer-switcher__name{flex:1;font-weight:500;color:#333;font-size:12px}.ol-layer-switcher__type{font-size:9px;padding:2px 5px;border-radius:3px;font-weight:700;text-transform:uppercase;background:#0000000f;color:#555;letter-spacing:.3px}.ol-layer-switcher__type--vector{background:#3b82f61f;color:#2563eb}.ol-layer-switcher__type--tile{background:#22c55e1f;color:#16a34a}.ol-layer-switcher__type--image{background:#f59e0b1f;color:#d97706}.ol-layer-switcher__opacity{width:100%;margin-top:4px;cursor:pointer;height:4px;accent-color:#1a73e8}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
361
387
|
}
|
|
362
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
388
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: OlLayerSwitcherComponent, decorators: [{
|
|
363
389
|
type: Component,
|
|
364
390
|
args: [{ selector: 'ol-layer-switcher', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
365
391
|
<div
|
|
@@ -377,7 +403,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
|
|
|
377
403
|
[attr.aria-expanded]="!isCollapsed()"
|
|
378
404
|
aria-label="Toggle layer switcher"
|
|
379
405
|
>
|
|
380
|
-
<span class="ol-layer-switcher__icon"
|
|
406
|
+
<span class="ol-layer-switcher__icon"
|
|
407
|
+
><svg
|
|
408
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
409
|
+
width="14"
|
|
410
|
+
height="14"
|
|
411
|
+
viewBox="0 0 24 24"
|
|
412
|
+
fill="none"
|
|
413
|
+
stroke="currentColor"
|
|
414
|
+
stroke-width="2.5"
|
|
415
|
+
stroke-linecap="round"
|
|
416
|
+
stroke-linejoin="round"
|
|
417
|
+
>
|
|
418
|
+
<polygon points="12 2 2 7 12 12 22 7 12 2"></polygon>
|
|
419
|
+
<polyline points="2 17 12 22 22 17"></polyline>
|
|
420
|
+
<polyline points="2 12 12 17 22 12"></polyline></svg
|
|
421
|
+
></span>
|
|
381
422
|
<span class="ol-layer-switcher__title">Layers</span>
|
|
382
423
|
</button>
|
|
383
424
|
|
|
@@ -428,7 +469,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
|
|
|
428
469
|
</div>
|
|
429
470
|
}
|
|
430
471
|
</div>
|
|
431
|
-
`, styles: [":host{display:block}.ol-layer-switcher{position:absolute;background:#
|
|
472
|
+
`, styles: [":host{display:block}.ol-layer-switcher{position:absolute;background:#fffffff2;color:#333;border-radius:4px;border:none;box-shadow:0 1px 4px #0000004d;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:13px;min-width:36px;z-index:10;transition:all .2s ease}.ol-layer-switcher--top-left{top:.5em;left:.5em}.ol-layer-switcher--top-right{top:10em;right:.5em}.ol-layer-switcher--bottom-left{bottom:.5em;left:.5em}.ol-layer-switcher--bottom-right{bottom:.5em;right:.5em}.ol-layer-switcher.collapsed{min-width:auto}.ol-layer-switcher__toggle{display:flex;align-items:center;gap:6px;padding:4px 8px;background:transparent;color:#333;border:none;border-bottom:1px solid rgba(0,0,0,.08);border-radius:4px 4px 0 0;cursor:pointer;width:100%;font-size:13px;font-weight:600;transition:background .15s ease;min-height:36px}.ol-layer-switcher.collapsed .ol-layer-switcher__toggle{border-bottom:none;border-radius:4px;padding:4px 6px;justify-content:center}.ol-layer-switcher__toggle:hover{background:#0000000d}.ol-layer-switcher__icon{font-size:14px;line-height:1}.ol-layer-switcher__title{font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.5px}.ol-layer-switcher.collapsed .ol-layer-switcher__title,.ol-layer-switcher.collapsed .ol-layer-switcher__panel{display:none}.ol-layer-switcher__panel{padding:6px;max-height:300px;overflow-y:auto}.ol-layer-switcher__empty{padding:12px;color:#6b7280;text-align:center;font-style:italic;font-size:12px}.ol-layer-switcher__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}.ol-layer-switcher__item{padding:5px 8px;border-radius:3px;transition:background .15s ease}.ol-layer-switcher__item:hover{background:#0000000a}.ol-layer-switcher__label{display:flex;align-items:center;gap:6px;cursor:pointer;font-size:12px}.ol-layer-switcher__checkbox{cursor:pointer;accent-color:#1a73e8}.ol-layer-switcher__name{flex:1;font-weight:500;color:#333;font-size:12px}.ol-layer-switcher__type{font-size:9px;padding:2px 5px;border-radius:3px;font-weight:700;text-transform:uppercase;background:#0000000f;color:#555;letter-spacing:.3px}.ol-layer-switcher__type--vector{background:#3b82f61f;color:#2563eb}.ol-layer-switcher__type--tile{background:#22c55e1f;color:#16a34a}.ol-layer-switcher__type--image{background:#f59e0b1f;color:#d97706}.ol-layer-switcher__opacity{width:100%;margin-top:4px;cursor:pointer;height:4px;accent-color:#1a73e8}\n"] }]
|
|
432
473
|
}], propDecorators: { position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], layers: [{ type: i0.Input, args: [{ isSignal: true, alias: "layers", required: false }] }], collapsible: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsible", required: false }] }], showOpacity: [{ type: i0.Input, args: [{ isSignal: true, alias: "showOpacity", required: false }] }], startCollapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "startCollapsed", required: false }] }], visibilityChange: [{ type: i0.Output, args: ["visibilityChange"] }], opacityChange: [{ type: i0.Output, args: ["opacityChange"] }] } });
|
|
433
474
|
|
|
434
475
|
// OlBasemapSwitcherComponent - Switch between base map providers
|
|
@@ -478,8 +519,8 @@ class OlBasemapSwitcherComponent {
|
|
|
478
519
|
return '🗺️';
|
|
479
520
|
}
|
|
480
521
|
}
|
|
481
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
482
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
522
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: OlBasemapSwitcherComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
523
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: OlBasemapSwitcherComponent, isStandalone: true, selector: "ol-basemap-switcher", inputs: { basemaps: { classPropertyName: "basemaps", publicName: "basemaps", isSignal: true, isRequired: false, transformFunction: null }, activeBasemap: { classPropertyName: "activeBasemap", publicName: "activeBasemap", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { basemapChange: "basemapChange" }, ngImport: i0, template: `
|
|
483
524
|
<div
|
|
484
525
|
class="ol-basemap-switcher"
|
|
485
526
|
[class.ol-basemap-switcher--top-left]="position() === 'top-left'"
|
|
@@ -514,15 +555,32 @@ class OlBasemapSwitcherComponent {
|
|
|
514
555
|
[attr.aria-expanded]="isExpanded()"
|
|
515
556
|
aria-label="Toggle basemap switcher"
|
|
516
557
|
>
|
|
517
|
-
<span class="ol-basemap-switcher__toggle-icon"
|
|
558
|
+
<span class="ol-basemap-switcher__toggle-icon"
|
|
559
|
+
><svg
|
|
560
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
561
|
+
width="14"
|
|
562
|
+
height="14"
|
|
563
|
+
viewBox="0 0 24 24"
|
|
564
|
+
fill="none"
|
|
565
|
+
stroke="currentColor"
|
|
566
|
+
stroke-width="2.5"
|
|
567
|
+
stroke-linecap="round"
|
|
568
|
+
stroke-linejoin="round"
|
|
569
|
+
>
|
|
570
|
+
<circle cx="12" cy="12" r="10"></circle>
|
|
571
|
+
<line x1="2" y1="12" x2="22" y2="12"></line>
|
|
572
|
+
<path
|
|
573
|
+
d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"
|
|
574
|
+
></path></svg
|
|
575
|
+
></span>
|
|
518
576
|
<span class="ol-basemap-switcher__toggle-text">
|
|
519
577
|
{{ getActiveBasemapName() }}
|
|
520
578
|
</span>
|
|
521
579
|
</button>
|
|
522
580
|
</div>
|
|
523
|
-
`, isInline: true, styles: [":host{display:block}.ol-basemap-switcher{position:absolute;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:
|
|
581
|
+
`, isInline: true, styles: [":host{display:block}.ol-basemap-switcher{position:absolute;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:13px;color:#333;z-index:10}.ol-basemap-switcher--top-left{top:.5em;left:.5em}.ol-basemap-switcher--top-center{top:.5em;left:50%;transform:translate(-50%)}.ol-basemap-switcher--top-right{top:.5em;right:.5em}.ol-basemap-switcher--bottom-left{bottom:.5em;left:.5em}.ol-basemap-switcher--bottom-center{bottom:.5em;left:50%;transform:translate(-50%)}.ol-basemap-switcher--bottom-right{bottom:.5em;right:.5em}.ol-basemap-switcher__toggle{display:flex;align-items:center;gap:6px;padding:4px 10px;background:#fffffff2;color:#333;border:none;border-radius:4px;box-shadow:0 1px 4px #0000004d;cursor:pointer;font-size:12px;font-weight:600;transition:background .15s ease;min-height:36px}.ol-basemap-switcher__toggle:hover{background:#fff}.ol-basemap-switcher__toggle-icon{font-size:14px;line-height:1}.ol-basemap-switcher__toggle-text{font-weight:600;font-size:12px}.ol-basemap-switcher__panel{position:absolute;bottom:calc(100% + 6px);left:0;background:#fffffff2;border:none;color:#333;border-radius:4px;box-shadow:0 1px 4px #0000004d;padding:4px;min-width:160px;display:flex;flex-direction:column;gap:2px}.ol-basemap-switcher--bottom-right .ol-basemap-switcher__panel,.ol-basemap-switcher--top-right .ol-basemap-switcher__panel{left:auto;right:0}.ol-basemap-switcher--top-left .ol-basemap-switcher__panel,.ol-basemap-switcher--top-center .ol-basemap-switcher__panel,.ol-basemap-switcher--top-right .ol-basemap-switcher__panel{bottom:auto;top:calc(100% + 6px)}.ol-basemap-switcher--top-center .ol-basemap-switcher__panel,.ol-basemap-switcher--bottom-center .ol-basemap-switcher__panel{left:50%;transform:translate(-50%)}.ol-basemap-switcher__item{display:flex;align-items:center;gap:8px;width:100%;padding:6px 10px;border:none;background:transparent;border-radius:3px;cursor:pointer;text-align:left;font-size:12px;transition:background .15s ease}.ol-basemap-switcher__item:hover{background:#0000000d}.ol-basemap-switcher__item--active{background:#1a73e81f;color:#1a73e8;font-weight:600}.ol-basemap-switcher__item--active:hover{background:#1a73e82e}.ol-basemap-switcher__icon{font-size:14px}.ol-basemap-switcher__name{font-weight:500;color:#333;font-size:12px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
524
582
|
}
|
|
525
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
583
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: OlBasemapSwitcherComponent, decorators: [{
|
|
526
584
|
type: Component,
|
|
527
585
|
args: [{ selector: 'ol-basemap-switcher', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
528
586
|
<div
|
|
@@ -559,23 +617,218 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
|
|
|
559
617
|
[attr.aria-expanded]="isExpanded()"
|
|
560
618
|
aria-label="Toggle basemap switcher"
|
|
561
619
|
>
|
|
562
|
-
<span class="ol-basemap-switcher__toggle-icon"
|
|
620
|
+
<span class="ol-basemap-switcher__toggle-icon"
|
|
621
|
+
><svg
|
|
622
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
623
|
+
width="14"
|
|
624
|
+
height="14"
|
|
625
|
+
viewBox="0 0 24 24"
|
|
626
|
+
fill="none"
|
|
627
|
+
stroke="currentColor"
|
|
628
|
+
stroke-width="2.5"
|
|
629
|
+
stroke-linecap="round"
|
|
630
|
+
stroke-linejoin="round"
|
|
631
|
+
>
|
|
632
|
+
<circle cx="12" cy="12" r="10"></circle>
|
|
633
|
+
<line x1="2" y1="12" x2="22" y2="12"></line>
|
|
634
|
+
<path
|
|
635
|
+
d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"
|
|
636
|
+
></path></svg
|
|
637
|
+
></span>
|
|
563
638
|
<span class="ol-basemap-switcher__toggle-text">
|
|
564
639
|
{{ getActiveBasemapName() }}
|
|
565
640
|
</span>
|
|
566
641
|
</button>
|
|
567
642
|
</div>
|
|
568
|
-
`, styles: [":host{display:block}.ol-basemap-switcher{position:absolute;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:
|
|
643
|
+
`, styles: [":host{display:block}.ol-basemap-switcher{position:absolute;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:13px;color:#333;z-index:10}.ol-basemap-switcher--top-left{top:.5em;left:.5em}.ol-basemap-switcher--top-center{top:.5em;left:50%;transform:translate(-50%)}.ol-basemap-switcher--top-right{top:.5em;right:.5em}.ol-basemap-switcher--bottom-left{bottom:.5em;left:.5em}.ol-basemap-switcher--bottom-center{bottom:.5em;left:50%;transform:translate(-50%)}.ol-basemap-switcher--bottom-right{bottom:.5em;right:.5em}.ol-basemap-switcher__toggle{display:flex;align-items:center;gap:6px;padding:4px 10px;background:#fffffff2;color:#333;border:none;border-radius:4px;box-shadow:0 1px 4px #0000004d;cursor:pointer;font-size:12px;font-weight:600;transition:background .15s ease;min-height:36px}.ol-basemap-switcher__toggle:hover{background:#fff}.ol-basemap-switcher__toggle-icon{font-size:14px;line-height:1}.ol-basemap-switcher__toggle-text{font-weight:600;font-size:12px}.ol-basemap-switcher__panel{position:absolute;bottom:calc(100% + 6px);left:0;background:#fffffff2;border:none;color:#333;border-radius:4px;box-shadow:0 1px 4px #0000004d;padding:4px;min-width:160px;display:flex;flex-direction:column;gap:2px}.ol-basemap-switcher--bottom-right .ol-basemap-switcher__panel,.ol-basemap-switcher--top-right .ol-basemap-switcher__panel{left:auto;right:0}.ol-basemap-switcher--top-left .ol-basemap-switcher__panel,.ol-basemap-switcher--top-center .ol-basemap-switcher__panel,.ol-basemap-switcher--top-right .ol-basemap-switcher__panel{bottom:auto;top:calc(100% + 6px)}.ol-basemap-switcher--top-center .ol-basemap-switcher__panel,.ol-basemap-switcher--bottom-center .ol-basemap-switcher__panel{left:50%;transform:translate(-50%)}.ol-basemap-switcher__item{display:flex;align-items:center;gap:8px;width:100%;padding:6px 10px;border:none;background:transparent;border-radius:3px;cursor:pointer;text-align:left;font-size:12px;transition:background .15s ease}.ol-basemap-switcher__item:hover{background:#0000000d}.ol-basemap-switcher__item--active{background:#1a73e81f;color:#1a73e8;font-weight:600}.ol-basemap-switcher__item--active:hover{background:#1a73e82e}.ol-basemap-switcher__icon{font-size:14px}.ol-basemap-switcher__name{font-weight:500;color:#333;font-size:12px}\n"] }]
|
|
569
644
|
}], propDecorators: { basemaps: [{ type: i0.Input, args: [{ isSignal: true, alias: "basemaps", required: false }] }], activeBasemap: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeBasemap", required: false }] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], basemapChange: [{ type: i0.Output, args: ["basemapChange"] }] } });
|
|
570
645
|
|
|
646
|
+
class OlGeolocationControlComponent {
|
|
647
|
+
mapService = inject(OlMapService);
|
|
648
|
+
zoneHelper = inject(OlZoneHelper);
|
|
649
|
+
destroyRef = inject(DestroyRef);
|
|
650
|
+
position = input('top-right', ...(ngDevMode ? [{ debugName: "position" }] : /* istanbul ignore next */ []));
|
|
651
|
+
trackingChange = output();
|
|
652
|
+
controlElement;
|
|
653
|
+
tracking = signal(false, ...(ngDevMode ? [{ debugName: "tracking" }] : /* istanbul ignore next */ []));
|
|
654
|
+
control;
|
|
655
|
+
geolocation;
|
|
656
|
+
positionFeature;
|
|
657
|
+
accuracyFeature;
|
|
658
|
+
layer;
|
|
659
|
+
constructor() {
|
|
660
|
+
afterNextRender(() => {
|
|
661
|
+
const map = this.mapService.getMap();
|
|
662
|
+
if (!map)
|
|
663
|
+
return;
|
|
664
|
+
this.zoneHelper.runOutsideAngular(() => {
|
|
665
|
+
// Create the Control
|
|
666
|
+
this.control = new Control({
|
|
667
|
+
element: this.controlElement.nativeElement,
|
|
668
|
+
});
|
|
669
|
+
map.addControl(this.control);
|
|
670
|
+
// Setup Geolocation
|
|
671
|
+
const view = map.getView();
|
|
672
|
+
this.geolocation = new Geolocation({
|
|
673
|
+
trackingOptions: {
|
|
674
|
+
enableHighAccuracy: true,
|
|
675
|
+
},
|
|
676
|
+
projection: view.getProjection(),
|
|
677
|
+
});
|
|
678
|
+
// Setup Features
|
|
679
|
+
this.accuracyFeature = new Feature();
|
|
680
|
+
this.positionFeature = new Feature();
|
|
681
|
+
this.positionFeature.setStyle(new Style({
|
|
682
|
+
image: new Circle({
|
|
683
|
+
radius: 6,
|
|
684
|
+
fill: new Fill({
|
|
685
|
+
color: '#3b82f6',
|
|
686
|
+
}),
|
|
687
|
+
stroke: new Stroke({
|
|
688
|
+
color: '#fff',
|
|
689
|
+
width: 2,
|
|
690
|
+
}),
|
|
691
|
+
}),
|
|
692
|
+
}));
|
|
693
|
+
// Setup Vector Layer to show position
|
|
694
|
+
const vectorSource = new Vector({
|
|
695
|
+
features: [this.accuracyFeature, this.positionFeature],
|
|
696
|
+
});
|
|
697
|
+
this.layer = new Vector$1({
|
|
698
|
+
source: vectorSource,
|
|
699
|
+
zIndex: 9999, // Always on top
|
|
700
|
+
});
|
|
701
|
+
map.addLayer(this.layer);
|
|
702
|
+
// Listeners
|
|
703
|
+
this.geolocation.on('change:accuracyGeometry', () => {
|
|
704
|
+
this.accuracyFeature?.setGeometry(this.geolocation?.getAccuracyGeometry() ?? undefined);
|
|
705
|
+
});
|
|
706
|
+
this.geolocation.on('change:position', () => {
|
|
707
|
+
const coordinates = this.geolocation?.getPosition();
|
|
708
|
+
this.positionFeature?.setGeometry(coordinates ? new Point(coordinates) : undefined);
|
|
709
|
+
if (coordinates && this.tracking()) {
|
|
710
|
+
map.getView().animate({ center: coordinates, duration: 500 });
|
|
711
|
+
}
|
|
712
|
+
});
|
|
713
|
+
});
|
|
714
|
+
});
|
|
715
|
+
this.destroyRef.onDestroy(() => {
|
|
716
|
+
const map = this.mapService.getMap();
|
|
717
|
+
if (map) {
|
|
718
|
+
if (this.control)
|
|
719
|
+
map.removeControl(this.control);
|
|
720
|
+
if (this.layer)
|
|
721
|
+
map.removeLayer(this.layer);
|
|
722
|
+
}
|
|
723
|
+
if (this.geolocation) {
|
|
724
|
+
this.geolocation.setTracking(false);
|
|
725
|
+
}
|
|
726
|
+
});
|
|
727
|
+
}
|
|
728
|
+
toggleTracking() {
|
|
729
|
+
const nextState = !this.tracking();
|
|
730
|
+
this.tracking.set(nextState);
|
|
731
|
+
this.trackingChange.emit(nextState);
|
|
732
|
+
if (this.geolocation) {
|
|
733
|
+
this.zoneHelper.runOutsideAngular(() => {
|
|
734
|
+
this.geolocation.setTracking(nextState);
|
|
735
|
+
if (nextState) {
|
|
736
|
+
const coordinates = this.geolocation.getPosition();
|
|
737
|
+
if (coordinates) {
|
|
738
|
+
this.mapService
|
|
739
|
+
.getMap()
|
|
740
|
+
?.getView()
|
|
741
|
+
.animate({ center: coordinates, zoom: 15, duration: 500 });
|
|
742
|
+
}
|
|
743
|
+
}
|
|
744
|
+
else {
|
|
745
|
+
this.positionFeature?.setGeometry(undefined);
|
|
746
|
+
this.accuracyFeature?.setGeometry(undefined);
|
|
747
|
+
}
|
|
748
|
+
});
|
|
749
|
+
}
|
|
750
|
+
}
|
|
751
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: OlGeolocationControlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
752
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.13", type: OlGeolocationControlComponent, isStandalone: true, selector: "ol-geolocation-control", inputs: { position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { trackingChange: "trackingChange" }, viewQueries: [{ propertyName: "controlElement", first: true, predicate: ["controlElement"], descendants: true }], ngImport: i0, template: `
|
|
753
|
+
<div
|
|
754
|
+
#controlElement
|
|
755
|
+
class="ol-geolocation-control ol-unselectable ol-control"
|
|
756
|
+
[ngClass]="position()"
|
|
757
|
+
>
|
|
758
|
+
<button
|
|
759
|
+
type="button"
|
|
760
|
+
[class.active]="tracking()"
|
|
761
|
+
(click)="toggleTracking()"
|
|
762
|
+
[attr.title]="tracking() ? 'Stop tracking' : 'Track location'"
|
|
763
|
+
>
|
|
764
|
+
<svg
|
|
765
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
766
|
+
viewBox="0 0 24 24"
|
|
767
|
+
fill="none"
|
|
768
|
+
stroke="currentColor"
|
|
769
|
+
stroke-width="2"
|
|
770
|
+
stroke-linecap="round"
|
|
771
|
+
stroke-linejoin="round"
|
|
772
|
+
class="geolocation-icon"
|
|
773
|
+
>
|
|
774
|
+
<circle cx="12" cy="12" r="10"></circle>
|
|
775
|
+
<circle cx="12" cy="12" r="3" [attr.fill]="tracking() ? 'currentColor' : 'none'"></circle>
|
|
776
|
+
<line x1="12" y1="2" x2="12" y2="4"></line>
|
|
777
|
+
<line x1="12" y1="20" x2="12" y2="22"></line>
|
|
778
|
+
<line x1="20" y1="12" x2="22" y2="12"></line>
|
|
779
|
+
<line x1="2" y1="12" x2="4" y2="12"></line>
|
|
780
|
+
</svg>
|
|
781
|
+
</button>
|
|
782
|
+
</div>
|
|
783
|
+
`, isInline: true, styles: [".ol-geolocation-control{position:absolute}.ol-geolocation-control.top-left{top:4.5em;left:.5em}.ol-geolocation-control.top-right{top:4.5em;right:.5em}.ol-geolocation-control.bottom-left{bottom:.5em;left:.5em}.ol-geolocation-control.bottom-right{bottom:.5em;right:.5em}button{display:flex;align-items:center;justify-content:center;width:1.375em;height:1.375em;padding:0;background-color:#fff6;border:none;cursor:pointer;border-radius:2px;color:#333;transition:all .2s}button:hover{background-color:#fffc}button.active{color:#3b82f6;background-color:#ffffffe6}.geolocation-icon{width:1em;height:1em}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
784
|
+
}
|
|
785
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: OlGeolocationControlComponent, decorators: [{
|
|
786
|
+
type: Component,
|
|
787
|
+
args: [{ selector: 'ol-geolocation-control', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
788
|
+
<div
|
|
789
|
+
#controlElement
|
|
790
|
+
class="ol-geolocation-control ol-unselectable ol-control"
|
|
791
|
+
[ngClass]="position()"
|
|
792
|
+
>
|
|
793
|
+
<button
|
|
794
|
+
type="button"
|
|
795
|
+
[class.active]="tracking()"
|
|
796
|
+
(click)="toggleTracking()"
|
|
797
|
+
[attr.title]="tracking() ? 'Stop tracking' : 'Track location'"
|
|
798
|
+
>
|
|
799
|
+
<svg
|
|
800
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
801
|
+
viewBox="0 0 24 24"
|
|
802
|
+
fill="none"
|
|
803
|
+
stroke="currentColor"
|
|
804
|
+
stroke-width="2"
|
|
805
|
+
stroke-linecap="round"
|
|
806
|
+
stroke-linejoin="round"
|
|
807
|
+
class="geolocation-icon"
|
|
808
|
+
>
|
|
809
|
+
<circle cx="12" cy="12" r="10"></circle>
|
|
810
|
+
<circle cx="12" cy="12" r="3" [attr.fill]="tracking() ? 'currentColor' : 'none'"></circle>
|
|
811
|
+
<line x1="12" y1="2" x2="12" y2="4"></line>
|
|
812
|
+
<line x1="12" y1="20" x2="12" y2="22"></line>
|
|
813
|
+
<line x1="20" y1="12" x2="22" y2="12"></line>
|
|
814
|
+
<line x1="2" y1="12" x2="4" y2="12"></line>
|
|
815
|
+
</svg>
|
|
816
|
+
</button>
|
|
817
|
+
</div>
|
|
818
|
+
`, styles: [".ol-geolocation-control{position:absolute}.ol-geolocation-control.top-left{top:4.5em;left:.5em}.ol-geolocation-control.top-right{top:4.5em;right:.5em}.ol-geolocation-control.bottom-left{bottom:.5em;left:.5em}.ol-geolocation-control.bottom-right{bottom:.5em;right:.5em}button{display:flex;align-items:center;justify-content:center;width:1.375em;height:1.375em;padding:0;background-color:#fff6;border:none;cursor:pointer;border-radius:2px;color:#333;transition:all .2s}button:hover{background-color:#fffc}button.active{color:#3b82f6;background-color:#ffffffe6}.geolocation-icon{width:1em;height:1em}\n"] }]
|
|
819
|
+
}], ctorParameters: () => [], propDecorators: { position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], trackingChange: [{ type: i0.Output, args: ["trackingChange"] }], controlElement: [{
|
|
820
|
+
type: ViewChild,
|
|
821
|
+
args: ['controlElement']
|
|
822
|
+
}] } });
|
|
823
|
+
|
|
571
824
|
// OlControlService
|
|
572
825
|
class OlControlService {
|
|
573
826
|
addCustomControl(element, position) { }
|
|
574
827
|
removeCustomControl(element) { }
|
|
575
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
576
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.
|
|
828
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: OlControlService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
829
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: OlControlService });
|
|
577
830
|
}
|
|
578
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
831
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: OlControlService, decorators: [{
|
|
579
832
|
type: Injectable
|
|
580
833
|
}] });
|
|
581
834
|
|
|
@@ -610,4 +863,4 @@ function provideControls() {
|
|
|
610
863
|
* Generated bundle index. Do not edit.
|
|
611
864
|
*/
|
|
612
865
|
|
|
613
|
-
export { OlAttributionControlComponent, OlBasemapSwitcherComponent, OlControlService, OlFullscreenControlComponent, OlLayerSwitcherComponent, OlRotateControlComponent, OlScaleLineControlComponent, OlZoomControlComponent, ROTATE_CONTROL_MAP_SERVICE, provideControls, withControls };
|
|
866
|
+
export { OlAttributionControlComponent, OlBasemapSwitcherComponent, OlControlService, OlFullscreenControlComponent, OlGeolocationControlComponent, OlLayerSwitcherComponent, OlRotateControlComponent, OlScaleLineControlComponent, OlZoomControlComponent, ROTATE_CONTROL_MAP_SERVICE, provideControls, withControls };
|