@geosdi/ngx-leaflet-timedimension-plugin 1.1.7 → 2.0.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.
Files changed (5) hide show
  1. package/README.md +134 -46
  2. package/fesm2022/geosdi-ngx-leaflet-timedimension-plugin.mjs +151 -209
  3. package/fesm2022/geosdi-ngx-leaflet-timedimension-plugin.mjs.map +1 -1
  4. package/package.json +4 -5
  5. package/types/geosdi-ngx-leaflet-timedimension-plugin.d.ts +170 -174
package/README.md CHANGED
@@ -1,56 +1,144 @@
1
- # NgxLeafletTimedimensionPlugin
1
+ # @geosdi/ngx-leaflet-timedimension-plugin
2
2
 
3
- This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 13.0.0.
4
-
5
- # General information
6
-
7
- Service to wrap leaflet timedimensione see documentation to https://github.com/socib/Leaflet.TimeDimension
3
+ Adds a time bar to a Leaflet map — play, step, loop, slider and speed — to animate layers that have
4
+ a time dimension, typically a WMS layer with `TIME`. It is an Angular service around
5
+ [Leaflet.TimeDimension](https://github.com/socib/Leaflet.TimeDimension), configured with a fluent
6
+ API, with the date shown in a format of your choice through luxon.
8
7
 
9
8
  ## Installation
10
9
 
11
10
  `npm i @geosdi/ngx-leaflet-timedimension-plugin --save`
12
11
 
13
- It depends on :
12
+ Peer dependencies:
13
+
14
+ "@angular/cdk": ">=22.0.0",
15
+ "@angular/core": ">=22.0.0",
16
+ "leaflet": ">=1.9.3",
17
+ "leaflet-timedimension": ">=1.1.1",
18
+ "luxon": ">=3.0.0"
19
+
20
+ **The library does not import `leaflet-timedimension`: the application does**, once, before
21
+ `applyTimeDimensionPlugin()` — it is what adds `L.TimeDimension`, its player and its control to
22
+ Leaflet, and without it the service fails with a `TypeError`, `… TimeDimension is not a
23
+ constructor`.
24
+ `leaflet-timedimension` imports Leaflet on its own, so no global `L` is needed. Include its
25
+ stylesheet too, for the bar's buttons and sliders:
26
+
27
+ ```typescript
28
+ import "leaflet-timedimension";
29
+ ```
14
30
 
15
- "@angular/common": ">=13.0.0",
16
- "@angular/core": ">=13.0.0",
17
- "leaflet": ">=1.7.1",
18
- "leaflet-timedimension": "^1.1.1"
31
+ ```json
32
+ "styles": ["node_modules/leaflet-timedimension/dist/leaflet.timedimension.control.css"]
33
+ ```
19
34
 
20
35
  ## Usage
21
36
 
22
- ```typescript
23
-
24
- import { Injectable } from '@angular/core';
25
- import {TimeDimensionExtensionService} from "./time-dimension-extension-service";
26
-
27
- @Injectable({
28
- providedIn: 'root'
29
- })
30
- export class Service {
31
-
32
-
33
- constructor(private ngxLeafletTimedimensionPluginService: TimeDimensionExtensionService) {
34
- }
35
-
36
- public addPlugin() {
37
- //4/11/2021
38
- const endTime = new Date(1636022400000);
39
- //28/10/2021
40
- const startTime = new Date(1636022400000 - 604800000);
41
- this.ngxLeafletTimedimensionPluginService
42
- .withTimeDimensionOptionsOptions({
43
- times: L.TimeDimension.Util.explodeTimeRange(startTime, endTime, "PT5M"),
44
- period: "P5M",
45
- })
46
- .withMap(this.map).withPlayerOptions({loop: true, transitionTime: 333}).applyTimeDimensionPlugin();
47
- this.ngxLeafletTimedimensionPluginService.setPlayerToLoop(true);
48
- wmsLayer.addTo(this.map);
49
- setTimeout(() => {
50
- this.ngxLeafletTimedimensionPluginService.setPlayerToLoop(false);
51
- }, 2000);
52
- }
53
-
54
- }
55
-
56
- ```
37
+ ```typescript
38
+ import { inject } from "@angular/core";
39
+ // The default import, not `import * as L`: with esbuild or Vite the namespace is a copy taken
40
+ // before leaflet-timedimension adds `L.timeDimension`, so `L.timeDimension.layer` would be
41
+ // undefined. The default export is the live Leaflet object (it needs esModuleInterop).
42
+ import L from "leaflet";
43
+ import "leaflet-timedimension";
44
+ import { NgxLeafletTimedimensionPluginService } from "@geosdi/ngx-leaflet-timedimension-plugin";
45
+
46
+ const timeDimension = inject(NgxLeafletTimedimensionPluginService);
47
+
48
+ timeDimension
49
+ .withMap(map)
50
+ .withTimeDimensionOptionsOptions({
51
+ timeInterval: "2026-11-01T00:00:00Z/2026-11-06T00:00:00Z",
52
+ period: "PT1H",
53
+ })
54
+ .withPlayerOptions({ transitionTime: 1000, loop: true })
55
+ .withDateTimeFormat("dd/MM/yyyy HH:mm")
56
+ .withPosition("bottomleft")
57
+ .applyTimeDimensionPlugin();
58
+
59
+ // the layer follows the time bar: applyTimeDimensionPlugin() set map.timeDimension
60
+ const wms = L.tileLayer.wms("https://example.org/geoserver/wms", {
61
+ layers: "workspace:layer",
62
+ format: "image/png",
63
+ transparent: true,
64
+ });
65
+ (L as any).timeDimension.layer.wms(wms).addTo(map);
66
+ ```
67
+
68
+ The options of `withTimeDimensionOptionsOptions` and `withPlayerOptions` are those of
69
+ Leaflet.TimeDimension's `L.TimeDimension` and `L.TimeDimension.Player`, passed as they are.
70
+
71
+ ## Methods
72
+
73
+ Every `with…` method returns the service, so the calls can be chained; `applyTimeDimensionPlugin()`
74
+ creates the time dimension, the player and the control, and adds the control to the map.
75
+
76
+ | Method | Default | Meaning |
77
+ | ------------------------------------------ | ----------- | ---------------------------------------------------------------------- |
78
+ | `withMap(map)` | — | the Leaflet map; required |
79
+ | `withTimeDimensionOptionsOptions(options)` | — | the options of `L.TimeDimension`: `times` or `timeInterval`, `period`… |
80
+ | `withPlayerOptions(options)` | — | the options of `L.TimeDimension.Player`: `transitionTime`, `loop`… |
81
+ | `withPosition(position)` | `"topleft"` | `"topleft"`, `"topright"`, `"bottomleft"` or `"bottomright"` |
82
+ | `withMinSpeed(fps)` | `1` | the lowest speed of the speed slider, in frames per second |
83
+ | `withMaxSpeed(fps)` | `5` | the highest one |
84
+ | `withDateTimeFormat(format)` | not set | a luxon format (`"dd/MM/yyyy HH:mm"`) for the date shown in the bar |
85
+ | `applyTimeDimensionPlugin()` | — | adds the time bar; does nothing without a map |
86
+
87
+ After `applyTimeDimensionPlugin()`:
88
+
89
+ | Method | Meaning |
90
+ | --------------------------------------- | ------------------------------------------------------------------------------------ |
91
+ | `period = "PT5M"` (setter) | the step used by the two `refresh…` methods; **required before them**, see below |
92
+ | `refreshAvailableTimes(start, end)` | replaces the available times with those from `start` to `end`, one every `period` |
93
+ | `refreshTimeDimensionAtLastTime(t, ms)` | the same, from `t - ms` to `t` (both epoch milliseconds) |
94
+ | `getCurrentTime()` | the current time, in epoch milliseconds |
95
+ | `setCurrentTime(time)` | moves to a time, in epoch milliseconds |
96
+ | `getLowerTimeLimit()` | the first available time |
97
+ | `getUpperTimeLimit()` | the last available time |
98
+ | `autoApdate()` | whether the current time is the last one, i.e. whether a new time should be followed |
99
+ | `play(steps)` | starts the player, moving `steps` times at each tick |
100
+ | `setPlayerToLoop(looped)` | whether the player starts over at the end |
101
+ | `setTransitionTime(ms)` | the time between two steps |
102
+
103
+ A subclass can override two `protected` hooks: `onLoadTimeChaged()`, called on every `timeload` of
104
+ the time dimension, and `onAvailableTimeChangedChaged()`, on every `availabletimeschanged`.
105
+
106
+ ## Things to know
107
+
108
+ - **The control is fixed in part**: loop and reverse-play buttons are always on, and the time zones
109
+ the user can switch between are `Local` and `UTC`, in that order.
110
+ - **The sliders depend on the window width at `applyTimeDimensionPlugin()`**: the time slider is
111
+ shown from 768px, the speed slider from 992px. The check is made once, with the CDK's
112
+ `BreakpointObserver`: resizing the window afterwards does not show or hide them.
113
+ - **`withDateTimeFormat` replaces the time zone switch**: the date is formatted by luxon in its
114
+ default zone (`Settings.defaultZone`, the browser's unless the application changes it) and
115
+ locale (`Settings.defaultLocale`), and clicking the date to switch to `UTC` no longer changes
116
+ what is shown. Without a format, the bar shows Leaflet.TimeDimension's own `toLocaleString()` or
117
+ ISO date, which does follow the switch.
118
+ - **`period` is a setter of its own, not the `period` option**: the one passed to
119
+ `withTimeDimensionOptionsOptions` is not read by the service. `refreshAvailableTimes` and
120
+ `refreshTimeDimensionAtLastTime` without `period` set throw
121
+ `Cannot read properties of undefined (reading 'toUpperCase')` from the ISO 8601 parser.
122
+ - **Every getter throws before `applyTimeDimensionPlugin()`**: the time dimension does not exist
123
+ yet.
124
+ - **`autoApdate()` is misspelled**, as are the two hooks and `withTimeDimensionOptionsOptions`: they
125
+ are part of the public API and are kept as they are. With no available times it returns `false`:
126
+ it checks the last time against `null`, while an empty list gives `undefined`.
127
+ - **The service is a singleton** (`providedIn: "root"`): the settings stay for the next call, and
128
+ each `applyTimeDimensionPlugin()` creates a new time dimension and adds a new bar, so call it once
129
+ per map.
130
+
131
+ ## Changes in 2.0.0
132
+
133
+ - **A major version** because the peer dependencies now ask for Angular 22: an application on an
134
+ older Angular can no longer install it. The API is unchanged unless a point below says otherwise.
135
+ - `typescript` is no longer a peer dependency: nothing in the package imports it.
136
+ - **The Angular peer dependencies are `>=22.0.0`**: the library is compiled and tested with
137
+ Angular 22 only, so it no longer claims to install on older versions.
138
+ - Compiled with Angular 22.
139
+ - `@angular/cdk` is declared as a peer dependency: the service imports its `BreakpointObserver`, and
140
+ installed alone the library did not resolve. `@angular/common` is no longer one: nothing in the
141
+ library imports it. The keywords say "timedimension" instead of "print".
142
+ - This README, which replaces the one generated by Angular CLI 13: it says that the application
143
+ imports `leaflet-timedimension` itself, and documents the methods and their traps. The code is
144
+ unchanged.
package/fesm2022/geosdi-ngx-leaflet-timedimension-plugin.mjs CHANGED
@@ -1,210 +1,152 @@
1
- import * as i0 from '@angular/core';
2
- import { inject, Injectable } from '@angular/core';
3
- import L from 'leaflet';
4
- import { BreakpointObserver } from '@angular/cdk/layout';
5
- import { DateTime } from 'luxon';
6
-
7
- class NgxLeafletTimedimensionPluginService {
8
- constructor() {
9
- this._playEnabled = false;
10
- this.position = "topleft";
11
- this.minSpeed = 1;
12
- this.maxSpeed = 5;
13
- this.breakpointObserver = inject(BreakpointObserver);
14
- }
15
- /**
16
- * @param range
17
- */
18
- withMap(map) {
19
- this.map = map;
20
- return this;
21
- }
22
- withPlayerOptions(options) {
23
- this.playerOptions = options;
24
- return this;
25
- }
26
- withPosition(position) {
27
- this.position = position;
28
- return this;
29
- }
30
- /***
31
- * @param options
32
- */
33
- withTimeDimensionOptionsOptions(options) {
34
- this.timeDimensionOptions = options;
35
- return this;
36
- }
37
- /**
38
- * @param maxSpeed
39
- */
40
- withMaxSpeed(maxSpeed) {
41
- this.maxSpeed = maxSpeed;
42
- return this;
43
- }
44
- /**
45
- * @param dateTimeFormat
46
- */
47
- withDateTimeFormat(dateTimeFormat) {
48
- this.dateTimeFormat = dateTimeFormat;
49
- return this;
50
- }
51
- /**
52
- * @param minSpeed
53
- */
54
- withMinSpeed(minSpeed) {
55
- this.minSpeed = minSpeed;
56
- return this;
57
- }
58
- /**
59
- *
60
- * @param startTime
61
- * @param endTime
62
- */
63
- refreshAvailableTimes(startTime, endTime) {
64
- this.timeDimension.setAvailableTimes(L.TimeDimension.Util.explodeTimeRange(startTime, endTime, this._period), "replace");
65
- }
66
- /**
67
- *
68
- */
69
- getCurrentTime() {
70
- return this.timeDimension.getCurrentTime();
71
- }
72
- /**
73
- * @param time
74
- */
75
- setCurrentTime(time) {
76
- this.timeDimension.setCurrentTime(new Date(time));
77
- }
78
- /**
79
- *
80
- */
81
- autoApdate() {
82
- return (this.getUpperTimeLimit() === null ||
83
- this.getUpperTimeLimit() === this.timeDimension.getCurrentTime());
84
- }
85
- /**
86
- */
87
- getLowerTimeLimit() {
88
- return this.timeDimension.getAvailableTimes()[0];
89
- }
90
- /**
91
- *
92
- */
93
- refreshTimeDimensionAtLastTime(time, range) {
94
- const endTime = new Date(time);
95
- const startTime = new Date(time - range);
96
- this.refreshAvailableTimes(startTime, endTime);
97
- }
98
- /**
99
- *
100
- */
101
- getUpperTimeLimit() {
102
- const length = this.timeDimension.getAvailableTimes().length;
103
- return this.timeDimension.getAvailableTimes()[length - 1];
104
- }
105
- /**
106
- *
107
- * @param time
108
- */
109
- setTransitionTime(time) {
110
- this.player.setTransitionTime(time);
111
- }
112
- /**
113
- *
114
- * @param step
115
- */
116
- play(step) {
117
- this.player.start(step);
118
- }
119
- /**
120
- * @param looped
121
- */
122
- setPlayerToLoop(looped) {
123
- this.player.setLooped(looped);
124
- }
125
- /**
126
- *
127
- * @param value
128
- */
129
- set period(value) {
130
- this._period = value;
131
- }
132
- /**
133
- */
134
- applyTimeDimensionPlugin() {
135
- if (this.map) {
136
- this.timeDimension = new L.TimeDimension(this.timeDimensionOptions);
137
- this.player = new L.TimeDimension.Player(this.playerOptions, this.timeDimension);
138
- this.timeDimensionControl = new L.Control.TimeDimension({
139
- player: this.player,
140
- loopButton: true,
141
- playReverseButton: true,
142
- timeSlider: this.isMd(),
143
- speedSlider: this.isLg(),
144
- position: this.position,
145
- minSpeed: this.minSpeed,
146
- maxSpeed: this.maxSpeed,
147
- timeZones: ["Local", "UTC"],
148
- });
149
- this.player.on("play", (eo) => {
150
- this._playEnabled = true;
151
- });
152
- this.player.on("stop", (eo) => {
153
- this._playEnabled = false;
154
- });
155
- this.timeDimension.on("timeload", () => {
156
- this.onLoadTimeChaged();
157
- });
158
- this.timeDimension.on("availabletimeschanged", (availableTimes) => {
159
- this.onAvailableTimeChangedChaged();
160
- });
161
- if (this.dateTimeFormat)
162
- this.timeDimensionControl._getDisplayDateFormat = (date) => {
163
- // Token luxon (es. "MMMM yyyy" -> "ottobre 2025"); il locale
164
- // segue il default globale di luxon (Settings.defaultLocale).
165
- return DateTime.fromJSDate(date).toFormat(this.dateTimeFormat);
166
- };
167
- this.map.timeDimension = this.timeDimension;
168
- this.map.addControl(this.timeDimensionControl);
169
- }
170
- }
171
- /**
172
- *
173
- */
174
- onLoadTimeChaged() { }
175
- /**
176
- *
177
- */
178
- onAvailableTimeChangedChaged() { }
179
- /**
180
- *
181
- */
182
- isMd() {
183
- return this.breakpointObserver.isMatched(["(min-width: 768px)"]);
184
- }
185
- /**
186
- *
187
- */
188
- isLg() {
189
- return this.breakpointObserver.isMatched(["(min-width: 992px)"]);
190
- }
191
- /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: NgxLeafletTimedimensionPluginService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
192
- /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: NgxLeafletTimedimensionPluginService, providedIn: "root" }); }
193
- }
194
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: NgxLeafletTimedimensionPluginService, decorators: [{
195
- type: Injectable,
196
- args: [{
197
- providedIn: "root",
198
- }]
199
- }] });
200
-
201
- /*
202
- * Public API Surface of ngx-leaflet-timedimension-plugin
203
- */
204
-
205
- /**
206
- * Generated bundle index. Do not edit.
207
- */
208
-
1
+ import * as i0 from "@angular/core";
2
+ import { Injectable, inject } from "@angular/core";
3
+ import L from "leaflet";
4
+ import { BreakpointObserver } from "@angular/cdk/layout";
5
+ import { DateTime } from "luxon";
6
+ var NgxLeafletTimedimensionPluginService = class NgxLeafletTimedimensionPluginService {
7
+ constructor() {
8
+ this._playEnabled = false;
9
+ this.position = "topleft";
10
+ this.minSpeed = 1;
11
+ this.maxSpeed = 5;
12
+ this.breakpointObserver = inject(BreakpointObserver);
13
+ }
14
+ withMap(map) {
15
+ this.map = map;
16
+ return this;
17
+ }
18
+ withPlayerOptions(options) {
19
+ this.playerOptions = options;
20
+ return this;
21
+ }
22
+ withPosition(position) {
23
+ this.position = position;
24
+ return this;
25
+ }
26
+ withTimeDimensionOptionsOptions(options) {
27
+ this.timeDimensionOptions = options;
28
+ return this;
29
+ }
30
+ withMaxSpeed(maxSpeed) {
31
+ this.maxSpeed = maxSpeed;
32
+ return this;
33
+ }
34
+ withDateTimeFormat(dateTimeFormat) {
35
+ this.dateTimeFormat = dateTimeFormat;
36
+ return this;
37
+ }
38
+ withMinSpeed(minSpeed) {
39
+ this.minSpeed = minSpeed;
40
+ return this;
41
+ }
42
+ refreshAvailableTimes(startTime, endTime) {
43
+ this.timeDimension.setAvailableTimes(L.TimeDimension.Util.explodeTimeRange(startTime, endTime, this._period), "replace");
44
+ }
45
+ getCurrentTime() {
46
+ return this.timeDimension.getCurrentTime();
47
+ }
48
+ setCurrentTime(time) {
49
+ this.timeDimension.setCurrentTime(new Date(time));
50
+ }
51
+ autoApdate() {
52
+ return this.getUpperTimeLimit() === null || this.getUpperTimeLimit() === this.timeDimension.getCurrentTime();
53
+ }
54
+ getLowerTimeLimit() {
55
+ return this.timeDimension.getAvailableTimes()[0];
56
+ }
57
+ refreshTimeDimensionAtLastTime(time, range) {
58
+ const endTime = new Date(time);
59
+ const startTime = new Date(time - range);
60
+ this.refreshAvailableTimes(startTime, endTime);
61
+ }
62
+ getUpperTimeLimit() {
63
+ const length = this.timeDimension.getAvailableTimes().length;
64
+ return this.timeDimension.getAvailableTimes()[length - 1];
65
+ }
66
+ setTransitionTime(time) {
67
+ this.player.setTransitionTime(time);
68
+ }
69
+ play(step) {
70
+ this.player.start(step);
71
+ }
72
+ setPlayerToLoop(looped) {
73
+ this.player.setLooped(looped);
74
+ }
75
+ set period(value) {
76
+ this._period = value;
77
+ }
78
+ applyTimeDimensionPlugin() {
79
+ if (this.map) {
80
+ this.timeDimension = new L.TimeDimension(this.timeDimensionOptions);
81
+ this.player = new L.TimeDimension.Player(this.playerOptions, this.timeDimension);
82
+ this.timeDimensionControl = new L.Control.TimeDimension({
83
+ player: this.player,
84
+ loopButton: true,
85
+ playReverseButton: true,
86
+ timeSlider: this.isMd(),
87
+ speedSlider: this.isLg(),
88
+ position: this.position,
89
+ minSpeed: this.minSpeed,
90
+ maxSpeed: this.maxSpeed,
91
+ timeZones: ["Local", "UTC"]
92
+ });
93
+ this.player.on("play", (eo) => {
94
+ this._playEnabled = true;
95
+ });
96
+ this.player.on("stop", (eo) => {
97
+ this._playEnabled = false;
98
+ });
99
+ this.timeDimension.on("timeload", () => {
100
+ this.onLoadTimeChaged();
101
+ });
102
+ this.timeDimension.on("availabletimeschanged", (availableTimes) => {
103
+ this.onAvailableTimeChangedChaged();
104
+ });
105
+ if (this.dateTimeFormat) this.timeDimensionControl._getDisplayDateFormat = (date) => {
106
+ return DateTime.fromJSDate(date).toFormat(this.dateTimeFormat);
107
+ };
108
+ this.map.timeDimension = this.timeDimension;
109
+ this.map.addControl(this.timeDimensionControl);
110
+ }
111
+ }
112
+ onLoadTimeChaged() {}
113
+ onAvailableTimeChangedChaged() {}
114
+ isMd() {
115
+ return this.breakpointObserver.isMatched(["(min-width: 768px)"]);
116
+ }
117
+ isLg() {
118
+ return this.breakpointObserver.isMatched(["(min-width: 992px)"]);
119
+ }
120
+ static {
121
+ this.ɵfac = i0.ɵɵngDeclareFactory({
122
+ minVersion: "12.0.0",
123
+ version: "22.2.4",
124
+ ngImport: i0,
125
+ type: NgxLeafletTimedimensionPluginService,
126
+ deps: [],
127
+ target: i0.ɵɵFactoryTarget.Injectable
128
+ });
129
+ }
130
+ static {
131
+ this.ɵprov = i0.ɵɵngDeclareInjectable({
132
+ minVersion: "12.0.0",
133
+ version: "22.2.4",
134
+ ngImport: i0,
135
+ type: NgxLeafletTimedimensionPluginService,
136
+ providedIn: "root"
137
+ });
138
+ }
139
+ };
140
+ i0.ɵɵngDeclareClassMetadata({
141
+ minVersion: "12.0.0",
142
+ version: "22.2.4",
143
+ ngImport: i0,
144
+ type: NgxLeafletTimedimensionPluginService,
145
+ decorators: [{
146
+ type: Injectable,
147
+ args: [{ providedIn: "root" }]
148
+ }]
149
+ });
209
150
  export { NgxLeafletTimedimensionPluginService };
210
- //# sourceMappingURL=geosdi-ngx-leaflet-timedimension-plugin.mjs.map
151
+
152
+ //# sourceMappingURL=geosdi-ngx-leaflet-timedimension-plugin.mjs.map
package/fesm2022/geosdi-ngx-leaflet-timedimension-plugin.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"geosdi-ngx-leaflet-timedimension-plugin.mjs","sources":["../../../../projects/geosdi/leaflet/ngx-leaflet-timedimension-plugin/src/lib/ngx-leaflet-timedimension-plugin.service.ts","../../../../projects/geosdi/leaflet/ngx-leaflet-timedimension-plugin/src/index.ts","../../../../projects/geosdi/leaflet/ngx-leaflet-timedimension-plugin/src/geosdi-ngx-leaflet-timedimension-plugin.ts"],"sourcesContent":["import { Injectable, inject } from \"@angular/core\";\n// L'import di default e non il namespace : `TimeDimension`, `Player` e il\n// controllo li aggiunge `leaflet-timedimension` all'oggetto di Leaflet, e il\n// namespace di un bundler (il pre-bundle di Vite nel `nx serve` di maplite) è\n// una fotografia presa prima di quel plugin, che quindi non li vede :\n// «L.TimeDimension is not a constructor». Il default è l'oggetto vivo.\n//@ts-ignore\nimport L from \"leaflet\";\nimport { BreakpointObserver } from \"@angular/cdk/layout\";\nimport { DateTime } from \"luxon\";\n\n/**\n * @author Vito Salvia - CNR IMAA geoSDI Group\n * @email vito.salvia@gmail.com\n */\n\n/**\n * @param title\n * @param pageSize\n * @param action\n */\nexport interface INgxLeafletTimedimensionPluginService {\n /**\n * @param map\n */\n withMap(map: any): INgxLeafletTimedimensionPluginService;\n\n /**\n * @param options\n */\n withPlayerOptions(options: any): INgxLeafletTimedimensionPluginService;\n\n /**\n * @param options\n */\n withTimeDimensionOptionsOptions(\n options: any,\n ): INgxLeafletTimedimensionPluginService;\n\n /**\n * @param position\n */\n withPosition(\n position: \"topleft\" | \"topright\" | \"bottomleft\" | \"bottomright\",\n ): INgxLeafletTimedimensionPluginService;\n\n /**\n * @param minSpeed\n */\n withMinSpeed(minSpeed: number): INgxLeafletTimedimensionPluginService;\n\n /**\n * @param maxSpeed\n */\n withMaxSpeed(maxSpeed: number): INgxLeafletTimedimensionPluginService;\n\n /**\n *\n * @param dateTimeFormat\n */\n withDateTimeFormat(\n dateTimeFormat: string,\n ): INgxLeafletTimedimensionPluginService;\n\n /*\n */\n applyTimeDimensionPlugin(): void;\n\n /**\n * @param startTime\n * @param endTime\n */\n refreshAvailableTimes(startTime: Date, endTime: Date): void;\n\n /**\n */\n getCurrentTime(): number;\n\n /**\n */\n getLowerTimeLimit(): number;\n\n /**\n * @param time\n * @param range\n */\n refreshTimeDimensionAtLastTime(time: number, range: number): void;\n\n /**\n */\n getUpperTimeLimit(): number;\n\n /**\n * @param step\n */\n play(step: number): void;\n\n /**\n * @param looped\n */\n setPlayerToLoop(looped: boolean): void;\n\n /**\n * @param time\n */\n setCurrentTime(time: number): any;\n}\n\n@Injectable({\n providedIn: \"root\",\n})\nexport class NgxLeafletTimedimensionPluginService implements INgxLeafletTimedimensionPluginService {\n private player: L.TimeDimension.Player;\n private _playEnabled = false;\n private playerOptions: any;\n private timeDimensionOptions: any;\n private timeDimensionControl: L.Control.TimeDimension;\n private timeDimension: L.TimeDimension;\n private map: any;\n private _period: string;\n private position: string = \"topleft\";\n private minSpeed: number = 1;\n private maxSpeed: number = 5;\n private dateTimeFormat: string;\n public breakpointObserver: BreakpointObserver = inject(BreakpointObserver);\n\n /**\n * @param range\n */\n withMap(map: any): INgxLeafletTimedimensionPluginService {\n this.map = map;\n return this;\n }\n\n withPlayerOptions(options: any): INgxLeafletTimedimensionPluginService {\n this.playerOptions = options;\n return this;\n }\n\n withPosition(\n position: \"topleft\" | \"topright\" | \"bottomleft\" | \"bottomright\",\n ): INgxLeafletTimedimensionPluginService {\n this.position = position;\n return this;\n }\n\n /***\n * @param options\n */\n withTimeDimensionOptionsOptions(\n options: any,\n ): INgxLeafletTimedimensionPluginService {\n this.timeDimensionOptions = options;\n return this;\n }\n\n /**\n * @param maxSpeed\n */\n withMaxSpeed(maxSpeed: number): INgxLeafletTimedimensionPluginService {\n this.maxSpeed = maxSpeed;\n return this;\n }\n\n /**\n * @param dateTimeFormat\n */\n withDateTimeFormat(\n dateTimeFormat: string,\n ): INgxLeafletTimedimensionPluginService {\n this.dateTimeFormat = dateTimeFormat;\n return this;\n }\n\n /**\n * @param minSpeed\n */\n withMinSpeed(minSpeed: number): INgxLeafletTimedimensionPluginService {\n this.minSpeed = minSpeed;\n return this;\n }\n\n /**\n *\n * @param startTime\n * @param endTime\n */\n public refreshAvailableTimes(startTime: Date, endTime: Date) {\n this.timeDimension.setAvailableTimes(\n L.TimeDimension.Util.explodeTimeRange(\n startTime,\n endTime,\n this._period,\n ),\n \"replace\",\n );\n }\n\n /**\n *\n */\n public getCurrentTime(): number {\n return this.timeDimension.getCurrentTime();\n }\n\n /**\n * @param time\n */\n public setCurrentTime(time: number): any {\n this.timeDimension.setCurrentTime(new Date(time));\n }\n\n /**\n *\n */\n public autoApdate(): boolean {\n return (\n this.getUpperTimeLimit() === null ||\n this.getUpperTimeLimit() === this.timeDimension.getCurrentTime()\n );\n }\n\n /**\n */\n public getLowerTimeLimit(): number {\n return this.timeDimension.getAvailableTimes()[0];\n }\n\n /**\n *\n */\n refreshTimeDimensionAtLastTime(time: number, range: number) {\n const endTime = new Date(time);\n const startTime = new Date(time - range);\n this.refreshAvailableTimes(startTime, endTime);\n }\n\n /**\n *\n */\n getUpperTimeLimit(): number {\n const length = this.timeDimension.getAvailableTimes().length;\n return this.timeDimension.getAvailableTimes()[length - 1];\n }\n\n /**\n *\n * @param time\n */\n setTransitionTime(time: number) {\n this.player.setTransitionTime(time);\n }\n\n /**\n *\n * @param step\n */\n play(step: number) {\n this.player.start(step);\n }\n\n /**\n * @param looped\n */\n setPlayerToLoop(looped: boolean): void {\n this.player.setLooped(looped);\n }\n\n /**\n *\n * @param value\n */\n set period(value: string) {\n this._period = value;\n }\n\n /**\n */\n applyTimeDimensionPlugin(): void {\n if (this.map) {\n this.timeDimension = new L.TimeDimension(this.timeDimensionOptions);\n this.player = new L.TimeDimension.Player(\n this.playerOptions,\n this.timeDimension,\n );\n this.timeDimensionControl = new L.Control.TimeDimension({\n player: this.player,\n loopButton: true,\n playReverseButton: true,\n timeSlider: this.isMd(),\n speedSlider: this.isLg(),\n position: this.position,\n minSpeed: this.minSpeed,\n maxSpeed: this.maxSpeed,\n timeZones: [\"Local\", \"UTC\"],\n });\n\n this.player.on(\"play\", (eo: any) => {\n this._playEnabled = true;\n });\n this.player.on(\"stop\", (eo: any) => {\n this._playEnabled = false;\n });\n this.timeDimension.on(\"timeload\", () => {\n this.onLoadTimeChaged();\n });\n this.timeDimension.on(\n \"availabletimeschanged\",\n (availableTimes: any) => {\n this.onAvailableTimeChangedChaged();\n },\n );\n\n if (this.dateTimeFormat)\n this.timeDimensionControl._getDisplayDateFormat = (\n date: Date,\n ) => {\n // Token luxon (es. \"MMMM yyyy\" -> \"ottobre 2025\"); il locale\n // segue il default globale di luxon (Settings.defaultLocale).\n return DateTime.fromJSDate(date).toFormat(\n this.dateTimeFormat,\n );\n };\n\n this.map.timeDimension = this.timeDimension;\n this.map.addControl(this.timeDimensionControl);\n }\n }\n\n /**\n *\n */\n protected onLoadTimeChaged(): void {}\n\n /**\n *\n */\n protected onAvailableTimeChangedChaged(): void {}\n\n /**\n *\n */\n private isMd(): boolean {\n return this.breakpointObserver.isMatched([\"(min-width: 768px)\"]);\n }\n\n /**\n *\n */\n private isLg(): boolean {\n return this.breakpointObserver.isMatched([\"(min-width: 992px)\"]);\n }\n}\n","/*\n * Public API Surface of ngx-leaflet-timedimension-plugin\n */\n\nexport * from \"./lib/ngx-leaflet-timedimension-plugin.service\";\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"geosdi-ngx-leaflet-timedimension-plugin.mjs","names":[],"sources":["../../../../projects/geosdi/leaflet/ngx-leaflet-timedimension-plugin/src/lib/ngx-leaflet-timedimension-plugin.service.ts"],"sourcesContent":["import { Injectable, inject } from \"@angular/core\";\n// L'import di default e non il namespace : `TimeDimension`, `Player` e il\n// controllo li aggiunge `leaflet-timedimension` all'oggetto di Leaflet, e il\n// namespace di un bundler (il pre-bundle di Vite nel `nx serve` di maplite) è\n// una fotografia presa prima di quel plugin, che quindi non li vede :\n// «L.TimeDimension is not a constructor». Il default è l'oggetto vivo.\n//@ts-ignore\nimport L from \"leaflet\";\nimport { BreakpointObserver } from \"@angular/cdk/layout\";\nimport { DateTime } from \"luxon\";\n\n/**\n * @author Vito Salvia - CNR IMAA geoSDI Group\n * @email vito.salvia@gmail.com\n */\n\n/**\n * @param title\n * @param pageSize\n * @param action\n */\nexport interface INgxLeafletTimedimensionPluginService {\n /**\n * @param map\n */\n withMap(map: any): INgxLeafletTimedimensionPluginService;\n\n /**\n * @param options\n */\n withPlayerOptions(options: any): INgxLeafletTimedimensionPluginService;\n\n /**\n * @param options\n */\n withTimeDimensionOptionsOptions(\n options: any,\n ): INgxLeafletTimedimensionPluginService;\n\n /**\n * @param position\n */\n withPosition(\n position: \"topleft\" | \"topright\" | \"bottomleft\" | \"bottomright\",\n ): INgxLeafletTimedimensionPluginService;\n\n /**\n * @param minSpeed\n */\n withMinSpeed(minSpeed: number): INgxLeafletTimedimensionPluginService;\n\n /**\n * @param maxSpeed\n */\n withMaxSpeed(maxSpeed: number): INgxLeafletTimedimensionPluginService;\n\n /**\n *\n * @param dateTimeFormat\n */\n withDateTimeFormat(\n dateTimeFormat: string,\n ): INgxLeafletTimedimensionPluginService;\n\n /*\n */\n applyTimeDimensionPlugin(): void;\n\n /**\n * @param startTime\n * @param endTime\n */\n refreshAvailableTimes(startTime: Date, endTime: Date): void;\n\n /**\n */\n getCurrentTime(): number;\n\n /**\n */\n getLowerTimeLimit(): number;\n\n /**\n * @param time\n * @param range\n */\n refreshTimeDimensionAtLastTime(time: number, range: number): void;\n\n /**\n */\n getUpperTimeLimit(): number;\n\n /**\n * @param step\n */\n play(step: number): void;\n\n /**\n * @param looped\n */\n setPlayerToLoop(looped: boolean): void;\n\n /**\n * @param time\n */\n setCurrentTime(time: number): any;\n}\n\n@Injectable({\n providedIn: \"root\",\n})\nexport class NgxLeafletTimedimensionPluginService implements INgxLeafletTimedimensionPluginService {\n private player: L.TimeDimension.Player;\n private _playEnabled = false;\n private playerOptions: any;\n private timeDimensionOptions: any;\n private timeDimensionControl: L.Control.TimeDimension;\n private timeDimension: L.TimeDimension;\n private map: any;\n private _period: string;\n private position: string = \"topleft\";\n private minSpeed: number = 1;\n private maxSpeed: number = 5;\n private dateTimeFormat: string;\n public breakpointObserver: BreakpointObserver = inject(BreakpointObserver);\n\n /**\n * @param range\n */\n withMap(map: any): INgxLeafletTimedimensionPluginService {\n this.map = map;\n return this;\n }\n\n withPlayerOptions(options: any): INgxLeafletTimedimensionPluginService {\n this.playerOptions = options;\n return this;\n }\n\n withPosition(\n position: \"topleft\" | \"topright\" | \"bottomleft\" | \"bottomright\",\n ): INgxLeafletTimedimensionPluginService {\n this.position = position;\n return this;\n }\n\n /***\n * @param options\n */\n withTimeDimensionOptionsOptions(\n options: any,\n ): INgxLeafletTimedimensionPluginService {\n this.timeDimensionOptions = options;\n return this;\n }\n\n /**\n * @param maxSpeed\n */\n withMaxSpeed(maxSpeed: number): INgxLeafletTimedimensionPluginService {\n this.maxSpeed = maxSpeed;\n return this;\n }\n\n /**\n * @param dateTimeFormat\n */\n withDateTimeFormat(\n dateTimeFormat: string,\n ): INgxLeafletTimedimensionPluginService {\n this.dateTimeFormat = dateTimeFormat;\n return this;\n }\n\n /**\n * @param minSpeed\n */\n withMinSpeed(minSpeed: number): INgxLeafletTimedimensionPluginService {\n this.minSpeed = minSpeed;\n return this;\n }\n\n /**\n *\n * @param startTime\n * @param endTime\n */\n public refreshAvailableTimes(startTime: Date, endTime: Date) {\n this.timeDimension.setAvailableTimes(\n L.TimeDimension.Util.explodeTimeRange(\n startTime,\n endTime,\n this._period,\n ),\n \"replace\",\n );\n }\n\n /**\n *\n */\n public getCurrentTime(): number {\n return this.timeDimension.getCurrentTime();\n }\n\n /**\n * @param time\n */\n public setCurrentTime(time: number): any {\n this.timeDimension.setCurrentTime(new Date(time));\n }\n\n /**\n *\n */\n public autoApdate(): boolean {\n return (\n this.getUpperTimeLimit() === null ||\n this.getUpperTimeLimit() === this.timeDimension.getCurrentTime()\n );\n }\n\n /**\n */\n public getLowerTimeLimit(): number {\n return this.timeDimension.getAvailableTimes()[0];\n }\n\n /**\n *\n */\n refreshTimeDimensionAtLastTime(time: number, range: number) {\n const endTime = new Date(time);\n const startTime = new Date(time - range);\n this.refreshAvailableTimes(startTime, endTime);\n }\n\n /**\n *\n */\n getUpperTimeLimit(): number {\n const length = this.timeDimension.getAvailableTimes().length;\n return this.timeDimension.getAvailableTimes()[length - 1];\n }\n\n /**\n *\n * @param time\n */\n setTransitionTime(time: number) {\n this.player.setTransitionTime(time);\n }\n\n /**\n *\n * @param step\n */\n play(step: number) {\n this.player.start(step);\n }\n\n /**\n * @param looped\n */\n setPlayerToLoop(looped: boolean): void {\n this.player.setLooped(looped);\n }\n\n /**\n *\n * @param value\n */\n set period(value: string) {\n this._period = value;\n }\n\n /**\n */\n applyTimeDimensionPlugin(): void {\n if (this.map) {\n this.timeDimension = new L.TimeDimension(this.timeDimensionOptions);\n this.player = new L.TimeDimension.Player(\n this.playerOptions,\n this.timeDimension,\n );\n this.timeDimensionControl = new L.Control.TimeDimension({\n player: this.player,\n loopButton: true,\n playReverseButton: true,\n timeSlider: this.isMd(),\n speedSlider: this.isLg(),\n position: this.position,\n minSpeed: this.minSpeed,\n maxSpeed: this.maxSpeed,\n timeZones: [\"Local\", \"UTC\"],\n });\n\n this.player.on(\"play\", (eo: any) => {\n this._playEnabled = true;\n });\n this.player.on(\"stop\", (eo: any) => {\n this._playEnabled = false;\n });\n this.timeDimension.on(\"timeload\", () => {\n this.onLoadTimeChaged();\n });\n this.timeDimension.on(\n \"availabletimeschanged\",\n (availableTimes: any) => {\n this.onAvailableTimeChangedChaged();\n },\n );\n\n if (this.dateTimeFormat)\n this.timeDimensionControl._getDisplayDateFormat = (\n date: Date,\n ) => {\n // Token luxon (es. \"MMMM yyyy\" -> \"ottobre 2025\"); il locale\n // segue il default globale di luxon (Settings.defaultLocale).\n return DateTime.fromJSDate(date).toFormat(\n this.dateTimeFormat,\n );\n };\n\n this.map.timeDimension = this.timeDimension;\n this.map.addControl(this.timeDimensionControl);\n }\n }\n\n /**\n *\n */\n protected onLoadTimeChaged(): void {}\n\n /**\n *\n */\n protected onAvailableTimeChangedChaged(): void {}\n\n /**\n *\n */\n private isMd(): boolean {\n return this.breakpointObserver.isMatched([\"(min-width: 768px)\"]);\n }\n\n /**\n *\n */\n private isLg(): boolean {\n return this.breakpointObserver.isMatched([\"(min-width: 992px)\"]);\n }\n}\n"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@geosdi/ngx-leaflet-timedimension-plugin",
3
- "version": "1.1.7",
3
+ "version": "2.0.0",
4
4
  "description": "Service to add timedimension to map",
5
5
  "author": "Salvia Vito (vito.salvia@gmail.com)",
6
6
  "keywords": [
@@ -9,17 +9,16 @@
9
9
  "typescript",
10
10
  "leaflet",
11
11
  "map",
12
- "print"
12
+ "timedimension"
13
13
  ],
14
14
  "license": "MIT",
15
15
  "dependencies": {
16
16
  "tslib": "^2.3.0"
17
17
  },
18
18
  "peerDependencies": {
19
- "@angular/common": ">=20.0.0",
20
- "@angular/core": ">=20.0.0",
19
+ "@angular/cdk": ">=22.0.0",
20
+ "@angular/core": ">=22.0.0",
21
21
  "leaflet": ">=1.9.3",
22
- "typescript": ">=5.0.0",
23
22
  "leaflet-timedimension": ">=1.1.1",
24
23
  "luxon": ">=3.0.0"
25
24
  },
package/types/geosdi-ngx-leaflet-timedimension-plugin.d.ts CHANGED
@@ -1,6 +1,5 @@
1
- import { BreakpointObserver } from '@angular/cdk/layout';
2
- import * as i0 from '@angular/core';
3
-
1
+ import { BreakpointObserver } from "@angular/cdk/layout";
2
+ import * as i0 from "@angular/core";
4
3
  /**
5
4
  * @author Vito Salvia - CNR IMAA geoSDI Group
6
5
  * @email vito.salvia@gmail.com
@@ -10,175 +9,172 @@ import * as i0 from '@angular/core';
10
9
  * @param pageSize
11
10
  * @param action
12
11
  */
13
- interface INgxLeafletTimedimensionPluginService {
14
- /**
15
- * @param map
16
- */
17
- withMap(map: any): INgxLeafletTimedimensionPluginService;
18
- /**
19
- * @param options
20
- */
21
- withPlayerOptions(options: any): INgxLeafletTimedimensionPluginService;
22
- /**
23
- * @param options
24
- */
25
- withTimeDimensionOptionsOptions(options: any): INgxLeafletTimedimensionPluginService;
26
- /**
27
- * @param position
28
- */
29
- withPosition(position: "topleft" | "topright" | "bottomleft" | "bottomright"): INgxLeafletTimedimensionPluginService;
30
- /**
31
- * @param minSpeed
32
- */
33
- withMinSpeed(minSpeed: number): INgxLeafletTimedimensionPluginService;
34
- /**
35
- * @param maxSpeed
36
- */
37
- withMaxSpeed(maxSpeed: number): INgxLeafletTimedimensionPluginService;
38
- /**
39
- *
40
- * @param dateTimeFormat
41
- */
42
- withDateTimeFormat(dateTimeFormat: string): INgxLeafletTimedimensionPluginService;
43
- applyTimeDimensionPlugin(): void;
44
- /**
45
- * @param startTime
46
- * @param endTime
47
- */
48
- refreshAvailableTimes(startTime: Date, endTime: Date): void;
49
- /**
50
- */
51
- getCurrentTime(): number;
52
- /**
53
- */
54
- getLowerTimeLimit(): number;
55
- /**
56
- * @param time
57
- * @param range
58
- */
59
- refreshTimeDimensionAtLastTime(time: number, range: number): void;
60
- /**
61
- */
62
- getUpperTimeLimit(): number;
63
- /**
64
- * @param step
65
- */
66
- play(step: number): void;
67
- /**
68
- * @param looped
69
- */
70
- setPlayerToLoop(looped: boolean): void;
71
- /**
72
- * @param time
73
- */
74
- setCurrentTime(time: number): any;
12
+ export interface INgxLeafletTimedimensionPluginService {
13
+ /**
14
+ * @param map
15
+ */
16
+ withMap(map: any): INgxLeafletTimedimensionPluginService;
17
+ /**
18
+ * @param options
19
+ */
20
+ withPlayerOptions(options: any): INgxLeafletTimedimensionPluginService;
21
+ /**
22
+ * @param options
23
+ */
24
+ withTimeDimensionOptionsOptions(options: any): INgxLeafletTimedimensionPluginService;
25
+ /**
26
+ * @param position
27
+ */
28
+ withPosition(position: "topleft" | "topright" | "bottomleft" | "bottomright"): INgxLeafletTimedimensionPluginService;
29
+ /**
30
+ * @param minSpeed
31
+ */
32
+ withMinSpeed(minSpeed: number): INgxLeafletTimedimensionPluginService;
33
+ /**
34
+ * @param maxSpeed
35
+ */
36
+ withMaxSpeed(maxSpeed: number): INgxLeafletTimedimensionPluginService;
37
+ /**
38
+ *
39
+ * @param dateTimeFormat
40
+ */
41
+ withDateTimeFormat(dateTimeFormat: string): INgxLeafletTimedimensionPluginService;
42
+ applyTimeDimensionPlugin(): void;
43
+ /**
44
+ * @param startTime
45
+ * @param endTime
46
+ */
47
+ refreshAvailableTimes(startTime: Date, endTime: Date): void;
48
+ /**
49
+ */
50
+ getCurrentTime(): number;
51
+ /**
52
+ */
53
+ getLowerTimeLimit(): number;
54
+ /**
55
+ * @param time
56
+ * @param range
57
+ */
58
+ refreshTimeDimensionAtLastTime(time: number, range: number): void;
59
+ /**
60
+ */
61
+ getUpperTimeLimit(): number;
62
+ /**
63
+ * @param step
64
+ */
65
+ play(step: number): void;
66
+ /**
67
+ * @param looped
68
+ */
69
+ setPlayerToLoop(looped: boolean): void;
70
+ /**
71
+ * @param time
72
+ */
73
+ setCurrentTime(time: number): any;
75
74
  }
76
- declare class NgxLeafletTimedimensionPluginService implements INgxLeafletTimedimensionPluginService {
77
- private player;
78
- private _playEnabled;
79
- private playerOptions;
80
- private timeDimensionOptions;
81
- private timeDimensionControl;
82
- private timeDimension;
83
- private map;
84
- private _period;
85
- private position;
86
- private minSpeed;
87
- private maxSpeed;
88
- private dateTimeFormat;
89
- breakpointObserver: BreakpointObserver;
90
- /**
91
- * @param range
92
- */
93
- withMap(map: any): INgxLeafletTimedimensionPluginService;
94
- withPlayerOptions(options: any): INgxLeafletTimedimensionPluginService;
95
- withPosition(position: "topleft" | "topright" | "bottomleft" | "bottomright"): INgxLeafletTimedimensionPluginService;
96
- /***
97
- * @param options
98
- */
99
- withTimeDimensionOptionsOptions(options: any): INgxLeafletTimedimensionPluginService;
100
- /**
101
- * @param maxSpeed
102
- */
103
- withMaxSpeed(maxSpeed: number): INgxLeafletTimedimensionPluginService;
104
- /**
105
- * @param dateTimeFormat
106
- */
107
- withDateTimeFormat(dateTimeFormat: string): INgxLeafletTimedimensionPluginService;
108
- /**
109
- * @param minSpeed
110
- */
111
- withMinSpeed(minSpeed: number): INgxLeafletTimedimensionPluginService;
112
- /**
113
- *
114
- * @param startTime
115
- * @param endTime
116
- */
117
- refreshAvailableTimes(startTime: Date, endTime: Date): void;
118
- /**
119
- *
120
- */
121
- getCurrentTime(): number;
122
- /**
123
- * @param time
124
- */
125
- setCurrentTime(time: number): any;
126
- /**
127
- *
128
- */
129
- autoApdate(): boolean;
130
- /**
131
- */
132
- getLowerTimeLimit(): number;
133
- /**
134
- *
135
- */
136
- refreshTimeDimensionAtLastTime(time: number, range: number): void;
137
- /**
138
- *
139
- */
140
- getUpperTimeLimit(): number;
141
- /**
142
- *
143
- * @param time
144
- */
145
- setTransitionTime(time: number): void;
146
- /**
147
- *
148
- * @param step
149
- */
150
- play(step: number): void;
151
- /**
152
- * @param looped
153
- */
154
- setPlayerToLoop(looped: boolean): void;
155
- /**
156
- *
157
- * @param value
158
- */
159
- set period(value: string);
160
- /**
161
- */
162
- applyTimeDimensionPlugin(): void;
163
- /**
164
- *
165
- */
166
- protected onLoadTimeChaged(): void;
167
- /**
168
- *
169
- */
170
- protected onAvailableTimeChangedChaged(): void;
171
- /**
172
- *
173
- */
174
- private isMd;
175
- /**
176
- *
177
- */
178
- private isLg;
179
- static ɵfac: i0.ɵɵFactoryDeclaration<NgxLeafletTimedimensionPluginService, never>;
180
- static ɵprov: i0.ɵɵInjectableDeclaration<NgxLeafletTimedimensionPluginService>;
181
- }
182
-
183
- export { NgxLeafletTimedimensionPluginService };
184
- export type { INgxLeafletTimedimensionPluginService };
75
+ export declare class NgxLeafletTimedimensionPluginService implements INgxLeafletTimedimensionPluginService {
76
+ private player;
77
+ private _playEnabled;
78
+ private playerOptions;
79
+ private timeDimensionOptions;
80
+ private timeDimensionControl;
81
+ private timeDimension;
82
+ private map;
83
+ private _period;
84
+ private position;
85
+ private minSpeed;
86
+ private maxSpeed;
87
+ private dateTimeFormat;
88
+ breakpointObserver: BreakpointObserver;
89
+ /**
90
+ * @param range
91
+ */
92
+ withMap(map: any): INgxLeafletTimedimensionPluginService;
93
+ withPlayerOptions(options: any): INgxLeafletTimedimensionPluginService;
94
+ withPosition(position: "topleft" | "topright" | "bottomleft" | "bottomright"): INgxLeafletTimedimensionPluginService;
95
+ /***
96
+ * @param options
97
+ */
98
+ withTimeDimensionOptionsOptions(options: any): INgxLeafletTimedimensionPluginService;
99
+ /**
100
+ * @param maxSpeed
101
+ */
102
+ withMaxSpeed(maxSpeed: number): INgxLeafletTimedimensionPluginService;
103
+ /**
104
+ * @param dateTimeFormat
105
+ */
106
+ withDateTimeFormat(dateTimeFormat: string): INgxLeafletTimedimensionPluginService;
107
+ /**
108
+ * @param minSpeed
109
+ */
110
+ withMinSpeed(minSpeed: number): INgxLeafletTimedimensionPluginService;
111
+ /**
112
+ *
113
+ * @param startTime
114
+ * @param endTime
115
+ */
116
+ refreshAvailableTimes(startTime: Date, endTime: Date): void;
117
+ /**
118
+ *
119
+ */
120
+ getCurrentTime(): number;
121
+ /**
122
+ * @param time
123
+ */
124
+ setCurrentTime(time: number): any;
125
+ /**
126
+ *
127
+ */
128
+ autoApdate(): boolean;
129
+ /**
130
+ */
131
+ getLowerTimeLimit(): number;
132
+ /**
133
+ *
134
+ */
135
+ refreshTimeDimensionAtLastTime(time: number, range: number): void;
136
+ /**
137
+ *
138
+ */
139
+ getUpperTimeLimit(): number;
140
+ /**
141
+ *
142
+ * @param time
143
+ */
144
+ setTransitionTime(time: number): void;
145
+ /**
146
+ *
147
+ * @param step
148
+ */
149
+ play(step: number): void;
150
+ /**
151
+ * @param looped
152
+ */
153
+ setPlayerToLoop(looped: boolean): void;
154
+ /**
155
+ *
156
+ * @param value
157
+ */
158
+ set period(value: string);
159
+ /**
160
+ */
161
+ applyTimeDimensionPlugin(): void;
162
+ /**
163
+ *
164
+ */
165
+ protected onLoadTimeChaged(): void;
166
+ /**
167
+ *
168
+ */
169
+ protected onAvailableTimeChangedChaged(): void;
170
+ /**
171
+ *
172
+ */
173
+ private isMd;
174
+ /**
175
+ *
176
+ */
177
+ private isLg;
178
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgxLeafletTimedimensionPluginService, never>;
179
+ static ɵprov: i0.ɵɵInjectableDeclaration<any>;
180
+ }