mobility-toolbox-js 3.0.1-beta.0 → 3.0.1-beta.3

package/README.md

@@ -10,7 +10,7 @@ The tools in this library have been inspired by many projects realized for publi
 
 ## Documentation and examples
 
-Visit https://mobility-toolbox-js.vercel.app/
+Visit https://mobility-toolbox-js.geops.io/
 
 ## Demos
 
@@ -24,7 +24,7 @@ Visit https://mobility-toolbox-js.vercel.app/
 Install the library and the peer dependencies:
 
 ```bash
-yarn add mobility-toolbox-js ol maplibre-gl
+yarn add ol maplibre-gl mobility-toolbox-js
 ```
 
 ## Development
@@ -34,9 +34,17 @@ yarn install
 yarn dev
 ```
 
+`yarn dev` starts a vite server using the `index.html` file at the root of the project.
+This html file loads the `dev.js` file. Use this file to develop the library.
+Each time you modifiy the library code you have to run `yarn build:tsc` to see the changes.
+
+## Development documentation
+
+The documentations website is located in the `doc/`  folder.
+It's a nextJS website that use the mobility-toolbox-js library built from the `build/` folder.
+
 ## Deploy
 
 This library website is deployed automatically using [Vercel](https://vercel.com/geops).
 For Vercel we have to add the nextjs and raw-loader modules in the dev dependencies of the main package.json.
 But those 2 librairies are not needed to build the library.
-

package/api/HttpAPI.js

@@ -14,9 +14,7 @@ import getUrlWithParams from '../common/utils/getUrlWithParams';
  */
 class HttpAPI {
     constructor(options) {
-        /** @private */
         this.url = options.url;
-        /** @private */
         this.apiKey = options.apiKey;
     }
     /**
@@ -29,7 +27,7 @@ class HttpAPI {
             if (!this.url) {
                 throw new Error(`No url defined for request to ${this.url}/${path}`);
             }
-            if (!this.url && !this.apiKey && !/key=/.test(this.url)) {
+            if (!this.url && !this.apiKey && !this.url.includes('key=')) {
                 // eslint-disable-next-line no-console
                 throw new Error(`No apiKey defined for request to ${this.url}`);
             }

package/api/RealtimeAPI.d.ts

@@ -55,7 +55,7 @@ export declare const RealtimeModes: {
  * });
  *
  * // Close the websocket connection
- * // api.close();
+ * api.close();
  *
  * @public
  */
@@ -63,12 +63,55 @@ declare class RealtimeAPI {
     _bbox?: RealtimeBbox;
     _buffer?: number[];
     _url: string;
+    version: RealtimeVersion;
+    wsApi: WebSocketAPI;
+    /**
+     * This callback type is called `requestCallback` and is displayed as a global symbol.
+     *
+     * @callback onFullTrajectoryMessageCallback
+     * @param {number} responseCode
+     * @param {string} responseMessage
+     */
+    /**
+     * The bounding box to receive data from.\
+     * Example: [minX, minY, maxX, maxY, zoom, mots , gen_level, tenant, ...]\
+     *  \
+     * Where:
+     * - **minX**: a string representation of an integer (not a float) representing the minimal X coordinate (in EPSG:3857) of a bounding box\
+     *  
+     * - **minY**: a string representation of an integer (not a float) representing the minimal Y coordinate (in EPSG:3857) of a bounding box\
+     *  
+     * - **maxX**: a string representation of an integer (not a float) representing the maximal X coordinate (in EPSG:3857) of a bounding box\
+     *  
+     * - **maxY**: a string representation of an integer (not a float) representing the maximal Y coordinate (in EPSG:3857) of a bounding box\
+     *  
+     * - **zoom**: a string representation of an integer representing the zoom level (from 4 to 22). When zoom < 8 only the trains are displayed for performance reasons.\
+     * &nbsp;
+     * - **mots**: A comma separated list of modes of transport. **Optional**.\
+     *         Example: "mots=rail,subway".\
+     * &nbsp;
+     * - **gen_level**: An integer representing the generalization level. **Optional**.\
+     *              Example: "gen_level=5"\
+     * &nbsp;
+     * - **tenant**: A string representing the tenant. **Optional**.\
+     *           Example: "tenant=sbb"\
+     * &nbsp;
+     * - ...: Any other values added to the bbox will be send to the server
+     *
+     * @type {string[]}
+     *
+     * @public
+     */
+    get bbox(): RealtimeBbox | undefined;
+    set bbox(newBbox: RealtimeBbox | undefined);
+    get buffer(): number[] | undefined;
+    set buffer(newBuffer: number[] | undefined);
+    get url(): string;
+    set url(newUrl: string);
     private pingInterval;
     private pingIntervalMs;
     private reconnectTimeout?;
     private reconnectTimeoutMs?;
-    version: RealtimeVersion;
-    wsApi: WebSocketAPI;
     /**
      * Constructor
      *
@@ -350,55 +393,12 @@ declare class RealtimeAPI {
      * @param {function(data: { content: RealtimeDeparture[] })} onMessage Callback function to unsubscribe. If null all subscriptions for the channel will be unsubscribed.
      * @public
      */
-    unsubscribeTimetabe(stationId: RealtimeStationId, onMessage?: WebSocketAPIMessageCallback<RealtimeDeparture>): void;
+    unsubscribeTimetable(stationId: RealtimeStationId, onMessage?: WebSocketAPIMessageCallback<RealtimeDeparture>): void;
     /**
      * Unsubscribe to trajectory channels.
      * @param {function(data: { content: RealtimeTrajectory })} onMessage Callback function to unsubscribe. If null all subscriptions for the channel will be unsubscribed.
      * @public
      */
     unsubscribeTrajectory(onMessage: WebSocketAPIMessageCallback<RealtimeTrajectory>): void;
-    /**
-     * This callback type is called `requestCallback` and is displayed as a global symbol.
-     *
-     * @callback onFullTrajectoryMessageCallback
-     * @param {number} responseCode
-     * @param {string} responseMessage
-     */
-    /**
-     * The bounding box to receive data from.\
-     * Example: [minX, minY, maxX, maxY, zoom, mots , gen_level, tenant, ...]\
-     * &nbsp;\
-     * Where:
-     * - **minX**: a string representation of an integer (not a float) representing the minimal X coordinate (in EPSG:3857) of a bounding box\
-     * &nbsp;
-     * - **minY**: a string representation of an integer (not a float) representing the minimal Y coordinate (in EPSG:3857) of a bounding box\
-     * &nbsp;
-     * - **maxX**: a string representation of an integer (not a float) representing the maximal X coordinate (in EPSG:3857) of a bounding box\
-     * &nbsp;
-     * - **maxY**: a string representation of an integer (not a float) representing the maximal Y coordinate (in EPSG:3857) of a bounding box\
-     * &nbsp;
-     * - **zoom**: a string representation of an integer representing the zoom level (from 4 to 22). When zoom < 8 only the trains are displayed for performance reasons.\
-     * &nbsp;
-     * - **mots**: A comma separated list of modes of transport. **Optional**.\
-     *         Example: "mots=rail,subway".\
-     * &nbsp;
-     * - **gen_level**: An integer representing the generalization level. **Optional**.\
-     *              Example: "gen_level=5"\
-     * &nbsp;
-     * - **tenant**: A string representing the tenant. **Optional**.\
-     *           Example: "tenant=sbb"\
-     * &nbsp;
-     * - ...: Any other values added to the bbox will be send to the server
-     *
-     * @type {string[]}
-     *
-     * @public
-     */
-    get bbox(): RealtimeBbox | undefined;
-    set bbox(newBbox: RealtimeBbox | undefined);
-    get buffer(): number[] | undefined;
-    set buffer(newBuffer: number[] | undefined);
-    get url(): string;
-    set url(newUrl: string);
 }
 export default RealtimeAPI;

package/api/RealtimeAPI.js

@@ -39,11 +39,82 @@ export const RealtimeModes = {
  * });
  *
  * // Close the websocket connection
- * // api.close();
+ * api.close();
  *
  * @public
  */
 class RealtimeAPI {
+    /**
+     * This callback type is called `requestCallback` and is displayed as a global symbol.
+     *
+     * @callback onFullTrajectoryMessageCallback
+     * @param {number} responseCode
+     * @param {string} responseMessage
+     */
+    /**
+     * The bounding box to receive data from.\
+     * Example: [minX, minY, maxX, maxY, zoom, mots , gen_level, tenant, ...]\
+     *  \
+     * Where:
+     * - **minX**: a string representation of an integer (not a float) representing the minimal X coordinate (in EPSG:3857) of a bounding box\
+     *  
+     * - **minY**: a string representation of an integer (not a float) representing the minimal Y coordinate (in EPSG:3857) of a bounding box\
+     *  
+     * - **maxX**: a string representation of an integer (not a float) representing the maximal X coordinate (in EPSG:3857) of a bounding box\
+     *  
+     * - **maxY**: a string representation of an integer (not a float) representing the maximal Y coordinate (in EPSG:3857) of a bounding box\
+     *  
+     * - **zoom**: a string representation of an integer representing the zoom level (from 4 to 22). When zoom < 8 only the trains are displayed for performance reasons.\
+     * &nbsp;
+     * - **mots**: A comma separated list of modes of transport. **Optional**.\
+     *         Example: "mots=rail,subway".\
+     * &nbsp;
+     * - **gen_level**: An integer representing the generalization level. **Optional**.\
+     *              Example: "gen_level=5"\
+     * &nbsp;
+     * - **tenant**: A string representing the tenant. **Optional**.\
+     *           Example: "tenant=sbb"\
+     * &nbsp;
+     * - ...: Any other values added to the bbox will be send to the server
+     *
+     * @type {string[]}
+     *
+     * @public
+     */
+    get bbox() {
+        return this._bbox;
+    }
+    set bbox(newBbox) {
+        if (JSON.stringify(newBbox) !== JSON.stringify(this._bbox)) {
+            this._bbox = newBbox;
+            if (this.wsApi && this._bbox) {
+                this.wsApi.send(`BBOX ${this._bbox.join(' ')}`);
+            }
+        }
+    }
+    get buffer() {
+        return this._buffer;
+    }
+    set buffer(newBuffer) {
+        if (JSON.stringify(newBuffer) !== JSON.stringify(this._buffer)) {
+            this._buffer = newBuffer;
+            if (this.wsApi && this._buffer) {
+                this.wsApi.send(`BUFFER ${this._buffer.join(' ')}`);
+            }
+        }
+    }
+    get url() {
+        return this._url;
+    }
+    set url(newUrl) {
+        if (this._url !== newUrl) {
+            this._url = newUrl;
+            // Update the websocket only if the url has changed and the websocket is already open or is opening.
+            if (this.wsApi.open || this.wsApi.connecting) {
+                this.open();
+            }
+        }
+    }
     /**
      * Constructor
      *
@@ -422,7 +493,7 @@ class RealtimeAPI {
      * @deprecated Use RealtimeAPI.unsubscribeTimetabe instead.
      */
     unsubscribeDepartures(stationId, onMessage) {
-        this.unsubscribeTimetabe(stationId, onMessage);
+        this.unsubscribeTimetable(stationId, onMessage);
     }
     /**
      * Unsubscribe disruptions.
@@ -490,7 +561,7 @@ class RealtimeAPI {
      * @param {function(data: { content: RealtimeDeparture[] })} onMessage Callback function to unsubscribe. If null all subscriptions for the channel will be unsubscribed.
      * @public
      */
-    unsubscribeTimetabe(stationId, onMessage) {
+    unsubscribeTimetable(stationId, onMessage) {
         this.unsubscribe(`timetable_${stationId}`, '', onMessage);
     }
     /**
@@ -501,76 +572,5 @@ class RealtimeAPI {
     unsubscribeTrajectory(onMessage) {
         this.unsubscribe(`trajectory`, '', onMessage);
     }
-    /**
-     * This callback type is called `requestCallback` and is displayed as a global symbol.
-     *
-     * @callback onFullTrajectoryMessageCallback
-     * @param {number} responseCode
-     * @param {string} responseMessage
-     */
-    /**
-     * The bounding box to receive data from.\
-     * Example: [minX, minY, maxX, maxY, zoom, mots , gen_level, tenant, ...]\
-     * &nbsp;\
-     * Where:
-     * - **minX**: a string representation of an integer (not a float) representing the minimal X coordinate (in EPSG:3857) of a bounding box\
-     * &nbsp;
-     * - **minY**: a string representation of an integer (not a float) representing the minimal Y coordinate (in EPSG:3857) of a bounding box\
-     * &nbsp;
-     * - **maxX**: a string representation of an integer (not a float) representing the maximal X coordinate (in EPSG:3857) of a bounding box\
-     * &nbsp;
-     * - **maxY**: a string representation of an integer (not a float) representing the maximal Y coordinate (in EPSG:3857) of a bounding box\
-     * &nbsp;
-     * - **zoom**: a string representation of an integer representing the zoom level (from 4 to 22). When zoom < 8 only the trains are displayed for performance reasons.\
-     * &nbsp;
-     * - **mots**: A comma separated list of modes of transport. **Optional**.\
-     *         Example: "mots=rail,subway".\
-     * &nbsp;
-     * - **gen_level**: An integer representing the generalization level. **Optional**.\
-     *              Example: "gen_level=5"\
-     * &nbsp;
-     * - **tenant**: A string representing the tenant. **Optional**.\
-     *           Example: "tenant=sbb"\
-     * &nbsp;
-     * - ...: Any other values added to the bbox will be send to the server
-     *
-     * @type {string[]}
-     *
-     * @public
-     */
-    get bbox() {
-        return this._bbox;
-    }
-    set bbox(newBbox) {
-        if (JSON.stringify(newBbox) !== JSON.stringify(this._bbox)) {
-            this._bbox = newBbox;
-            if (this.wsApi && this._bbox) {
-                this.wsApi.send(`BBOX ${this._bbox.join(' ')}`);
-            }
-        }
-    }
-    get buffer() {
-        return this._buffer;
-    }
-    set buffer(newBuffer) {
-        if (JSON.stringify(newBuffer) !== JSON.stringify(this._buffer)) {
-            this._buffer = newBuffer;
-            if (this.wsApi && this._buffer) {
-                this.wsApi.send(`BUFFER ${this._buffer.join(' ')}`);
-            }
-        }
-    }
-    get url() {
-        return this._url;
-    }
-    set url(newUrl) {
-        if (this._url !== newUrl) {
-            this._url = newUrl;
-            // Update the websocket only if the url has changed and the websocket is already open or is opening.
-            if (this.wsApi.open || this.wsApi.connecting) {
-                this.open();
-            }
-        }
-    }
 }
 export default RealtimeAPI;

package/api/WebSocketAPI.js

@@ -71,7 +71,6 @@ class WebSocketAPI {
                 this.websocket.close();
             }
         }
-        /** @private */
         this.websocket = new WebSocket(url);
         if (!this.open) {
             this.websocket.addEventListener('open', () => {

package/common/controls/StopFinderControlCommon.d.ts

@@ -30,7 +30,7 @@ declare class StopFinderControlCommon {
      * @param {Object} options Options
      * @param {HTMLElement} options.element HTML element where to attach input and suggestions.
      * @param {string} options.apiKey Access key for [geOps services](https://developer.geops.io/). See StopsAPI.
-     * @param {string} [options.url='https://api.geops.io/tracker/v1'] Stops service url. See StopsAPI.
+     * @param {string} [options.url='https://api.geops.io/stops/v1/'] Stops service url. See StopsAPI.
      * @param {string} [options.placeholder='Search for a stop...'] Input field placeholder.
      * @param {StopsSearchParams} [options.apiParams={ limit: 20 }] Request parameters. See [Stops service documentation](https://developer.geops.io/apis/5dcbd702a256d90001cf1361/).
      */

package/common/controls/StopFinderControlCommon.js

@@ -13,7 +13,7 @@ class StopFinderControlCommon {
      * @param {Object} options Options
      * @param {HTMLElement} options.element HTML element where to attach input and suggestions.
      * @param {string} options.apiKey Access key for [geOps services](https://developer.geops.io/). See StopsAPI.
-     * @param {string} [options.url='https://api.geops.io/tracker/v1'] Stops service url. See StopsAPI.
+     * @param {string} [options.url='https://api.geops.io/stops/v1/'] Stops service url. See StopsAPI.
      * @param {string} [options.placeholder='Search for a stop...'] Input field placeholder.
      * @param {StopsSearchParams} [options.apiParams={ limit: 20 }] Request parameters. See [Stops service documentation](https://developer.geops.io/apis/5dcbd702a256d90001cf1361/).
      */

package/common/styles/realtimeDefaultStyle.js

@@ -1,5 +1,4 @@
 import createCanvas from '../utils/createCanvas';
-/** @private */
 const cacheDelayBg = {};
 /**
  * Draw circle delay background
@@ -25,7 +24,6 @@ export const getDelayBgCanvas = (origin, radius, color) => {
     }
     return cacheDelayBg[key];
 };
-/** @private */
 const cacheDelayText = {};
 /**
  * Draw delay text
@@ -55,7 +53,6 @@ export const getDelayTextCanvas = (text, fontSize, font, delayColor, delayOutlin
     }
     return cacheDelayText[key];
 };
-/** @private */
 const cacheCircle = {};
 /**
  * Draw colored circle with black border
@@ -90,7 +87,6 @@ export const getCircleCanvas = (origin, radius, color, hasStroke, hasDash, pixel
     }
     return cacheCircle[key];
 };
-/** @private */
 const cacheText = {};
 /**
  * Draw text in the circle
@@ -129,7 +125,6 @@ export const getTextCanvas = (text, origin, textSize, fillColor, strokeColor, ha
     }
     return cacheText[key];
 };
-/** @private */
 const cache = {};
 /**
  * A tracker style that take in account the delay.

package/common/styles/realtimeHeadingStyle.js

@@ -1,16 +1,13 @@
 import createCanvas from '../utils/createCanvas';
 import { getBgColor } from '../utils/realtimeConfig';
 import realtimeDefaultStyle from './realtimeDefaultStyle';
-/** @private */
 const rotateCanvas = (canvas, rotation) => {
     const ctx = canvas.getContext('2d');
     ctx === null || ctx === void 0 ? void 0 : ctx.translate(canvas.width / 2, canvas.height / 2);
     ctx === null || ctx === void 0 ? void 0 : ctx.rotate(rotation);
     ctx === null || ctx === void 0 ? void 0 : ctx.translate(-canvas.width / 2, -canvas.height / 2);
 };
-/** @private */
 const arrowCache = {};
-/** @private */
 const getArrowCanvas = (fillColor) => {
     const key = `${fillColor}`;
     if (!arrowCache[key]) {
@@ -35,9 +32,7 @@ const getArrowCanvas = (fillColor) => {
     }
     return arrowCache[key];
 };
-/** @private */
 const bufferArrowCache = {};
-/** @private */
 const getBufferArrowCanvas = (canvas, fillColor, rotation) => {
     const margin = 20;
     const bufferKey = `${fillColor},${canvas.width},${canvas.height},${rotation}`;

package/common/styles/realtimeSimpleStyle.d.ts

@@ -1,4 +1,3 @@
 import type { RealtimeStyleFunction } from '../../types';
-/** @private */
 declare const realtimeSimpleStyle: RealtimeStyleFunction;
 export default realtimeSimpleStyle;

package/common/styles/realtimeSimpleStyle.js

@@ -4,7 +4,6 @@ import createCanvas from '../utils/createCanvas';
  * Display blue point for each train.
  */
 let canvas;
-/** @private */
 const realtimeSimpleStyle = () => {
     if (!canvas) {
         canvas = createCanvas(15, 15);

package/common/typedefs.d.ts

@@ -50,88 +50,6 @@ export type FeatureInfo = {
      */
     coordinate: number[2];
 };
-export type MaplibreLayerOptions = {
-    /**
-     * Access key for [geOps apis](https://developer.geops.io/).
-     */
-    apiKey: string;
-    /**
-     * geOps Maps api key name.
-     */
-    apiKeyName: string;
-    /**
-     * Maplibre map options.
-     */
-    mapLibreOptions: maplibregl.MapOptions;
-    /**
-     * geOps Maps api style.
-     */
-    style: string;
-    /**
-     * geOps Maps api url.
-     */
-    url: string;
-};
-export type ControlCommonOptions = {
-    /**
-     * Whether the control is active or not.
-     */
-    active?: boolean | undefined;
-    /**
-     * The HTML element used to render the control.
-     */
-    element: HTMLElement;
-    /**
-     * The HTML element where to render the element property. Default is the map's element.
-     */
-    target: HTMLElement;
-    /**
-     * Render function called whenever the control needs to be rerendered.
-     */
-    render: Function;
-};
-export type LayerCommonOptions = {
-    /**
-     * Identifier of the layer. Must be unique.
-     */
-    key: string;
-    /**
-     * Name of the layer.
-     */
-    name: string;
-    /**
-     * Group of the layer.
-     */
-    group: string;
-    /**
-     * List of copyrights.
-     */
-    copyrights: string[];
-    /**
-     * List of children layers.
-     */
-    children: Layer[];
-    /**
-     * Define if the layer is currently display on the map.
-     */
-    visible: boolean;
-    /**
-     * Define if the layer is currently display on the map but can't be seen (extent, zoom ,data restrictions).
-     */
-    disabled: boolean;
-    /**
-     * Hit-detection tolerance in css pixels. Pixels inside the radius around the given position will be checked for features.
-     */
-    hittolerance: number;
-    /**
-     * - Custom properties.
-     */
-    properties: Object;
-    /**
-     * - The map used to display the layer.
-     */
-    map: AnyMap;
-};
 export type VehiclePosition = {
     /**
      * Coordinate of the vehicle position in Mercator .
@@ -142,10 +60,6 @@ export type VehiclePosition = {
      */
     rotation: number;
 };
-/**
- * /Map~Map|maplibregl.Map} AnyMap
- */
-type dummy = ol;
 /**
  * @typedef {function} FilterFunction
  * @param {Vehicle} vehicle Vehicle to filter.
@@ -180,37 +94,6 @@ type dummy = ol;
  * @property {Feature[]} features  An array of features.
  * @property {number[2]} coordinate The coordinate where to find the featue.
  */
-/**
- * @typedef {ol/Map~Map|maplibregl.Map} AnyMap
- */
-/**
- * @typedef {Object} MaplibreLayerOptions
- * @property {string} apiKey Access key for [geOps apis](https://developer.geops.io/).
- * @property {string} apiKeyName geOps Maps api key name.
- * @property {maplibregl.MapOptions} options.mapLibreOptions Maplibre map options.
- * @property {string} style geOps Maps api style.
- * @property {string} url geOps Maps api url.
- */
-/**
- * @typedef {Object} ControlCommonOptions
- * @property {boolean} [active = true] Whether the control is active or not.
- * @property {HTMLElement} element The HTML element used to render the control.
- * @property {HTMLElement} target The HTML element where to render the element property. Default is the map's element.
- * @property {function} render Render function called whenever the control needs to be rerendered.
- */
-/**
- * @typedef {Object} LayerCommonOptions
- * @property {string!} key Identifier of the layer. Must be unique.
- * @property {string!} name  Name of the layer.
- * @property {string!} group Group of the layer.
- * @property {string[]!} copyrights List of copyrights.
- * @property {Layer[]!} children List of children layers.
- * @property {boolean!} visible  Define if the layer is currently display on the map.
- * @property {boolean!} disabled Define if the layer is currently display on the map but can't be seen (extent, zoom ,data restrictions).
- * @property {number!} hittolerance Hit-detection tolerance in css pixels. Pixels inside the radius around the given position will be checked for features.
- * @property {Object!} properties - Custom properties.
- * @property {AnyMap!} map - The map used to display the layer.
- */
 /**
  * @typedef {Object} VehiclePosition
  * @property {number[2]} coord Coordinate of the vehicle position in Mercator .

package/common/typedefs.js

@@ -32,37 +32,6 @@
  * @property {Feature[]} features  An array of features.
  * @property {number[2]} coordinate The coordinate where to find the featue.
  */
-/**
- * @typedef {ol/Map~Map|maplibregl.Map} AnyMap
- */
-/**
- * @typedef {Object} MaplibreLayerOptions
- * @property {string} apiKey Access key for [geOps apis](https://developer.geops.io/).
- * @property {string} apiKeyName geOps Maps api key name.
- * @property {maplibregl.MapOptions} options.mapLibreOptions Maplibre map options.
- * @property {string} style geOps Maps api style.
- * @property {string} url geOps Maps api url.
- */
-/**
- * @typedef {Object} ControlCommonOptions
- * @property {boolean} [active = true] Whether the control is active or not.
- * @property {HTMLElement} element The HTML element used to render the control.
- * @property {HTMLElement} target The HTML element where to render the element property. Default is the map's element.
- * @property {function} render Render function called whenever the control needs to be rerendered.
- */
-/**
- * @typedef {Object} LayerCommonOptions
- * @property {string!} key Identifier of the layer. Must be unique.
- * @property {string!} name  Name of the layer.
- * @property {string!} group Group of the layer.
- * @property {string[]!} copyrights List of copyrights.
- * @property {Layer[]!} children List of children layers.
- * @property {boolean!} visible  Define if the layer is currently display on the map.
- * @property {boolean!} disabled Define if the layer is currently display on the map but can't be seen (extent, zoom ,data restrictions).
- * @property {number!} hittolerance Hit-detection tolerance in css pixels. Pixels inside the radius around the given position will be checked for features.
- * @property {Object!} properties - Custom properties.
- * @property {AnyMap!} map - The map used to display the layer.
- */
 /**
  * @typedef {Object} VehiclePosition
  * @property {number[2]} coord Coordinate of the vehicle position in Mercator .