itowns 2.44.3-next.4 → 2.44.3-next.40

package/lib/Source/Source.js

@@ -1,3 +1,4 @@
+import * as CRS from "../Core/Geographic/Crs.js";
 import Extent from "../Core/Geographic/Extent.js";
 import GeoJsonParser from "../Parser/GeoJsonParser.js";
 import KMLParser from "../Parser/KMLParser.js";
@@ -7,40 +8,17 @@ import GTXParser from "../Parser/GTXParser.js";
 import ISGParser from "../Parser/ISGParser.js";
 import VectorTileParser from "../Parser/VectorTileParser.js";
 import Fetcher from "../Provider/Fetcher.js";
-import Cache from "../Core/Scheduler/Cache.js";
-import CRS from "../Core/Geographic/Crs.js";
+// import Cache from 'Core/Scheduler/Cache';
+import { LRUCache } from 'lru-cache';
 
 /** @private */
 export const supportedParsers = new Map([['application/geo+json', GeoJsonParser.parse], ['application/json', GeoJsonParser.parse], ['application/kml', KMLParser.parse], ['application/gpx', GpxParser.parse], ['application/x-protobuf;type=mapbox-vector', VectorTileParser.parse], ['application/gtx', GTXParser.parse], ['application/isg', ISGParser.parse], ['application/gdf', GDFParser.parse]]);
 const noCache = {
-  getByArray: () => {},
-  setByArray: a => a,
+  get: () => {},
+  set: a => a,
   clear: () => {}
 };
 
-/**
- * @property {string} crs - data crs projection.
- * @property {boolean} isInverted - This option is to be set to the
- * correct value, true or false (default being false), if the computation of
- * the coordinates needs to be inverted to same scheme as OSM, Google Maps
- * or other system. See [this link](
- * https://alastaira.wordpress.com/2011/07/06/converting-tms-tile-coordinates-to-googlebingosm-tile-coordinates)
- * for more informations.
- *
- */
-class InformationsData {
-  constructor(options) {
-    /* istanbul ignore next */
-    if (options.projection) {
-      console.warn('Source projection parameter is deprecated, use crs instead.');
-      options.crs = options.crs || options.projection;
-    }
-    if (options.crs) {
-      CRS.isValid(options.crs);
-    }
-    this.crs = options.crs;
-  }
-}
 /**
  * This interface describes parsing options.
  * @typedef {Object} ParsingOptions
@@ -94,13 +72,20 @@ let uid = 0;
  *  depending on the current fetched tile for example</li>
  * </ul>
  */
-class Source extends InformationsData {
+class Source {
   /**
    * @param {Object} source - An object that can contain all properties of a
    * Source. Only the `url` property is mandatory.
    */
   constructor(source) {
-    super(source);
+    if (source.projection) {
+      console.warn('Source projection parameter is deprecated, use crs instead.');
+      source.crs = source.crs || source.projection;
+    }
+    if (source.crs) {
+      CRS.isValid(source.crs);
+    }
+    this.crs = source.crs;
     this.isSource = true;
     if (!source.url) {
       throw new Error('New Source: url is required');
@@ -122,7 +107,7 @@ class Source extends InformationsData {
     this.whenReady = Promise.resolve();
     this._featuresCaches = {};
     if (source.extent && !source.extent.isExtent) {
-      this.extent = new Extent(this.crs, source.extent);
+      this.extent = new Extent(this.crs).setFromExtent(source.extent);
     } else {
       this.extent = source.extent;
     }
@@ -142,8 +127,8 @@ class Source extends InformationsData {
   urlFromExtent() {
     throw new Error('In extended Source, you have to implement the method urlFromExtent!');
   }
-  requestToKey(extent) {
-    return [extent.zoom, extent.row, extent.col];
+  getDataKey(extent) {
+    return `z${extent.zoom}r${extent.row}c${extent.col}`;
   }
 
   /**
@@ -156,25 +141,18 @@ class Source extends InformationsData {
    */
   loadData(extent, out) {
     const cache = this._featuresCaches[out.crs];
-    const key = this.requestToKey(extent);
+    const key = this.getDataKey(extent);
+    // console.log('Source.loadData', key);
     // try to get parsed data from cache
-    let features = cache.getByArray(key);
+    let features = cache.get(key);
     if (!features) {
       // otherwise fetch/parse the data
-      features = cache.setByArray(this.fetcher(this.urlFromExtent(extent), this.networkOptions).then(file => this.parser(file, {
+      features = this.fetcher(this.urlFromExtent(extent), this.networkOptions).then(file => this.parser(file, {
         out,
         in: this,
         extent
-      })).catch(err => this.handlingError(err)), key);
-
-      /* istanbul ignore next */
-      if (this.onParsedFile) {
-        features.then(feat => {
-          this.onParsedFile(feat);
-          console.warn('Source.onParsedFile was deprecated');
-          return feat;
-        });
-      }
+      })).catch(err => this.handlingError(err));
+      cache.set(key, features);
     }
     return features;
   }
@@ -190,7 +168,9 @@ class Source extends InformationsData {
       // Cache feature only if it's vector data, the feature are cached in source.
       // It's not necessary to cache raster in Source,
       // because it's already cached on layer.
-      this._featuresCaches[options.out.crs] = this.isVectorSource ? new Cache() : noCache;
+      this._featuresCaches[options.out.crs] = this.isVectorSource ? new LRUCache({
+        max: 500
+      }) : noCache;
     }
   }
 

package/lib/Source/TMSSource.js

@@ -1,8 +1,9 @@
 import Source from "./Source.js";
 import URLBuilder from "../Provider/URLBuilder.js";
-import Extent, { globalExtentTMS } from "../Core/Geographic/Extent.js";
-import CRS from "../Core/Geographic/Crs.js";
-const extent = new Extent(CRS.tms_4326, 0, 0, 0);
+import Extent from "../Core/Geographic/Extent.js";
+import Tile from "../Core/Tile/Tile.js";
+import { globalExtentTMS } from "../Core/Tile/TileGrid.js";
+const _tile = new Tile('EPSG:4326', 0, 0, 0);
 
 /**
  * An object defining the source of resources to get from a
@@ -86,7 +87,7 @@ class TMSSource extends Source {
     }
     this.zoom = source.zoom;
     this.isInverted = source.isInverted || false;
-    this.crs = CRS.formatToTms(source.crs);
+    this.crs = source.crs;
     this.tileMatrixSetLimits = source.tileMatrixSetLimits;
     this.extentSetlimits = {};
     this.tileMatrixCallback = source.tileMatrixCallback || (zoomLevel => zoomLevel);
@@ -107,8 +108,8 @@ class TMSSource extends Source {
       }
     }
   }
-  urlFromExtent(extent) {
-    return URLBuilder.xyz(extent, this);
+  urlFromExtent(tile) {
+    return URLBuilder.xyz(tile, this);
   }
   onLayerAdded(options) {
     super.onLayerAdded(options);
@@ -118,17 +119,17 @@ class TMSSource extends Source {
     const crs = parent ? parent.extent.crs : options.out.crs;
     if (this.tileMatrixSetLimits && !this.extentSetlimits[crs]) {
       this.extentSetlimits[crs] = {};
-      extent.crs = this.crs;
+      _tile.crs = this.crs;
       for (let i = this.zoom.max; i >= this.zoom.min; i--) {
         const tmsl = this.tileMatrixSetLimits[i];
         const {
           west,
           north
-        } = extent.set(i, tmsl.minTileRow, tmsl.minTileCol).as(crs);
+        } = _tile.set(i, tmsl.minTileRow, tmsl.minTileCol).toExtent(crs);
         const {
           east,
           south
-        } = extent.set(i, tmsl.maxTileRow, tmsl.maxTileCol).as(crs);
+        } = _tile.set(i, tmsl.maxTileRow, tmsl.maxTileCol).toExtent(crs);
         this.extentSetlimits[crs][i] = new Extent(crs, west, east, south, north);
       }
     }

package/lib/Source/VectorTilesSource.js

@@ -1,5 +1,5 @@
-import { featureFilter } from '@mapbox/mapbox-gl-style-spec';
-import Style from "../Core/Style.js";
+import { featureFilter } from '@maplibre/maplibre-gl-style-spec';
+import StyleOptions from "../Core/StyleOptions.js";
 import TMSSource from "./TMSSource.js";
 import URLBuilder from "../Provider/URLBuilder.js";
 import Fetcher from "../Provider/Fetcher.js";
@@ -20,6 +20,15 @@ function mergeCollections(collections) {
   return collection;
 }
 
+// A deprecated (but still in use) Mapbox spec allows using 'ref' as a propertie to reference an other layer
+// instead of duplicating the following properties: 'type', 'source', 'source-layer', 'minzoom', 'maxzoom', 'filter', 'layout'
+function getPropertiesFromRefLayer(layers, layer) {
+  const refLayer = layers.filter(l => l.id === layer.ref)[0];
+  ['type', 'source', 'source-layer', 'minzoom', 'maxzoom', 'filter', 'layout'].forEach(prop => {
+    layer[prop] = refLayer[prop];
+  });
+}
+
 /**
  * VectorTilesSource are object containing informations on how to fetch vector
  * tiles resources.
@@ -69,36 +78,41 @@ class VectorTilesSource extends TMSSource {
     let promise;
     this.isVectorTileSource = true;
     this.accessToken = source.accessToken;
+    let mvtStyleUrl;
     if (source.style) {
       if (typeof source.style == 'string') {
-        const styleUrl = urlParser.normalizeStyleURL(source.style, this.accessToken);
-        promise = Fetcher.json(styleUrl, this.networkOptions);
+        mvtStyleUrl = urlParser.normalizeStyleURL(source.style, this.accessToken);
+        promise = Fetcher.json(mvtStyleUrl, this.networkOptions);
       } else {
         promise = Promise.resolve(source.style);
       }
     } else {
       throw new Error('New VectorTilesSource: style is required');
     }
-    this.whenReady = promise.then(style => {
-      this.jsonStyle = style;
-      const baseurl = source.sprite || style.sprite;
+    this.whenReady = promise.then(mvtStyle => {
+      this.jsonStyle = mvtStyle;
+      let baseurl = source.sprite || mvtStyle.sprite;
       if (baseurl) {
+        baseurl = new URL(baseurl, mvtStyleUrl).toString();
         const spriteUrl = urlParser.normalizeSpriteURL(baseurl, '', '.json', this.accessToken);
         return Fetcher.json(spriteUrl, this.networkOptions).then(sprites => {
           this.sprites = sprites;
           const imgUrl = urlParser.normalizeSpriteURL(baseurl, '', '.png', this.accessToken);
           this.sprites.source = imgUrl;
-          return style;
+          return mvtStyle;
         });
       }
-      return style;
-    }).then(style => {
-      style.layers.forEach((layer, order) => {
+      return mvtStyle;
+    }).then(mvtStyle => {
+      mvtStyle.layers.forEach((layer, order) => {
         layer.sourceUid = this.uid;
         if (layer.type === 'background') {
           this.backgroundLayer = layer;
         } else if (ffilter(layer)) {
-          const style = Style.setFromVectorTileLayer(layer, this.sprites, order, this.symbolToCircle);
+          if (layer['source-layer'] === undefined) {
+            getPropertiesFromRefLayer(mvtStyle.layers, layer);
+          }
+          const style = StyleOptions.setFromVectorTileLayer(layer, this.sprites, this.symbolToCircle);
           this.styles[layer.id] = style;
           if (!this.layers[layer['source-layer']]) {
             this.layers[layer['source-layer']] = [];
@@ -106,20 +120,18 @@ class VectorTilesSource extends TMSSource {
           this.layers[layer['source-layer']].push({
             id: layer.id,
             order,
-            filterExpression: featureFilter(layer.filter),
-            zoom: {
-              min: layer.minzoom || 0,
-              max: layer.maxzoom || 24
-            }
+            filterExpression: featureFilter(layer.filter)
           });
         }
       });
       if (this.url == '.') {
-        const TMSUrlList = Object.values(style.sources).map(sourceVT => {
+        const TMSUrlList = Object.values(mvtStyle.sources).map(sourceVT => {
           if (sourceVT.url) {
+            sourceVT.url = new URL(sourceVT.url, mvtStyleUrl).toString();
             const urlSource = urlParser.normalizeSourceURL(sourceVT.url, this.accessToken);
             return Fetcher.json(urlSource, this.networkOptions).then(tileJSON => {
               if (tileJSON.tiles[0]) {
+                tileJSON.tiles[0] = decodeURIComponent(new URL(tileJSON.tiles[0], urlSource).toString());
                 return toTMSUrl(tileJSON.tiles[0]);
               }
             });
@@ -130,13 +142,13 @@ class VectorTilesSource extends TMSSource {
         });
         return Promise.all(TMSUrlList);
       }
-      return Promise.resolve([this.url]);
+      return Promise.resolve([toTMSUrl(this.url)]);
     }).then(TMSUrlList => {
       this.urls = Array.from(new Set(TMSUrlList));
     });
   }
-  urlFromExtent(extent, url) {
-    return URLBuilder.xyz(extent, {
+  urlFromExtent(tile, url) {
+    return URLBuilder.xyz(tile, {
       tileMatrixCallback: this.tileMatrixCallback,
       url
     });
@@ -152,25 +164,17 @@ class VectorTilesSource extends TMSSource {
   }
   loadData(extent, out) {
     const cache = this._featuresCaches[out.crs];
-    const key = this.requestToKey(extent);
+    const key = this.getDataKey(extent);
     // try to get parsed data from cache
-    let features = cache.getByArray(key);
+    let features = cache.get(key);
     if (!features) {
       // otherwise fetch/parse the data
-      features = cache.setByArray(Promise.all(this.urls.map(url => this.fetcher(this.urlFromExtent(extent, url), this.networkOptions).then(file => this.parser(file, {
+      features = Promise.all(this.urls.map(url => this.fetcher(this.urlFromExtent(extent, url), this.networkOptions).then(file => this.parser(file, {
         out,
         in: this,
         extent
-      })))).then(collections => mergeCollections(collections)).catch(err => this.handlingError(err)), key);
-
-      /* istanbul ignore next */
-      if (this.onParsedFile) {
-        features.then(feat => {
-          this.onParsedFile(feat);
-          console.warn('Source.onParsedFile was deprecated');
-          return feat;
-        });
-      }
+      })))).then(collections => mergeCollections(collections)).catch(err => this.handlingError(err));
+      cache.set(key, features);
     }
     return features;
   }

package/lib/Source/WFSSource.js

@@ -1,6 +1,7 @@
 import Source from "./Source.js";
 import URLBuilder from "../Provider/URLBuilder.js";
-import CRS from "../Core/Geographic/Crs.js";
+import Extent from "../Core/Geographic/Extent.js";
+const _extent = new Extent('EPSG:4326');
 
 /**
  * An object defining the source of resources to get from a
@@ -118,22 +119,25 @@ class WFSSource extends Source {
     this.typeName = source.typeName;
     this.version = source.version || '2.0.2';
     this.bboxDigits = source.bboxDigits;
-
-    // Add ? at the end of the url if it is not already in the given URL
-    if (!this.url.endsWith('?')) {
-      this.url = `${this.url}?`;
-    }
-    this.url = `${source.url}SERVICE=WFS&REQUEST=GetFeature&typeName=${this.typeName}&VERSION=${this.version}&SRSNAME=${this.crs}&outputFormat=${this.format}&BBOX=%bbox,${this.crs}`;
     this.zoom = {
       min: 0,
       max: Infinity
     };
+    const urlObj = new URL(source.url);
+    urlObj.searchParams.set('SERVICE', 'WFS');
+    urlObj.searchParams.set('REQUEST', 'GetFeature');
+    urlObj.searchParams.set('typeName', this.typeName);
+    urlObj.searchParams.set('VERSION', this.version);
+    urlObj.searchParams.set('SRSNAME', this.crs);
+    urlObj.searchParams.set('outputFormat', this.format);
+    urlObj.searchParams.set('BBOX', `%bbox,${this.crs}`);
     this.vendorSpecific = source.vendorSpecific;
     for (const name in this.vendorSpecific) {
       if (Object.prototype.hasOwnProperty.call(this.vendorSpecific, name)) {
-        this.url = `${this.url}&${name}=${this.vendorSpecific[name]}`;
+        urlObj.searchParams.set(name, this.vendorSpecific[name]);
       }
     }
+    this.url = decodeURIComponent(urlObj.toString());
   }
   handlingError(err) {
     if (err.response && err.response.status == 400) {
@@ -148,14 +152,15 @@ class WFSSource extends Source {
     }
     return super.handlingError(err);
   }
-  requestToKey(extent) {
-    if (CRS.isTms(extent.crs)) {
-      return super.requestToKey(extent);
+  getDataKey(extent) {
+    if (extent.isTile) {
+      return super.getDataKey(extent);
     } else {
-      return [extent.zoom, extent.south, extent.west];
+      return `z${extent.zoom}s${extent.south}w${extent.west}`;
     }
   }
-  urlFromExtent(extent) {
+  urlFromExtent(extentOrTile) {
+    const extent = extentOrTile.isExtent ? extentOrTile.as(this.crs, _extent) : extentOrTile.toExtent(this.crs, _extent);
     return URLBuilder.bbox(extent, this);
   }
   extentInsideLimit(extent) {

package/lib/Source/WMSSource.js

@@ -1,5 +1,36 @@
 import Source from "./Source.js";
 import URLBuilder from "../Provider/URLBuilder.js";
+import Extent from "../Core/Geographic/Extent.js";
+import * as CRS from "../Core/Geographic/Crs.js";
+const _extent = new Extent('EPSG:4326');
+
+/**
+ * Proj provides an optional param to define axis order and orientation for a
+ * given projection. 'enu' for instance stands for east, north, up.
+ * Elevation is not needed here. The two first characters are sufficient to map
+ * proj axis to iTowns bbox order formalism.
+ * 'enu' corresponds to 'wsen' because bbox starts by lower value coordinates
+ * and preserves axis ordering, here long/lat.
+ */
+const projAxisToBboxMappings = {
+  en: 'wsen',
+  es: 'wnes',
+  wn: 'eswn',
+  ws: 'enws',
+  ne: 'swne',
+  se: 'nwse',
+  nw: 'senw',
+  sw: 'nesw'
+};
+
+/**
+ * Provides the bbox axis order matching provided proj4 axis
+ * @param {string} projAxis the CRS axis order as defined in proj4
+ * @returns {string} the corresponding bbox axis order to use for WMS 1.3.0
+ */
+function projAxisToWmsBbox(projAxis) {
+  return projAxis && projAxisToBboxMappings[projAxis.slice(0, 2)] || 'wsen';
+}
 
 /**
  * An object defining the source of images to get from a
@@ -95,32 +126,39 @@ class WMSSource extends Source {
     this.version = source.version || '1.3.0';
     this.transparent = source.transparent || false;
     this.bboxDigits = source.bboxDigits;
-    if (!source.axisOrder) {
-      // 4326 (lat/long) axis order depends on the WMS version used
-      if (this.crs == 'EPSG:4326') {
-        // EPSG 4326 x = lat, long = y
-        // version 1.1.0 long/lat while version 1.3.0 mandates xy (so lat,long)
-        this.axisOrder = this.version === '1.1.0' ? 'wsen' : 'swne';
-      } else {
-        // xy,xy order
-        this.axisOrder = 'wsen';
-      }
+    if (source.axisOrder) {
+      this.axisOrder = source.axisOrder;
+    } else if (this.version === '1.3.0') {
+      // If not set, axis order depends on WMS version
+      // Version 1.3.0 depends on CRS axis order as defined in epsg.org database
+      this.axisOrder = projAxisToWmsBbox(CRS.axisOrder(this.crs));
+    } else {
+      // Versions 1.X.X mandate long/lat order, east-north orientation
+      this.axisOrder = 'wsen';
     }
     const crsPropName = this.version === '1.3.0' ? 'CRS' : 'SRS';
-
-    // Add ? at the end of the url if it is not already in the given URL
-    if (!this.url.endsWith('?')) {
-      this.url = `${this.url}?`;
-    }
-    this.url = `${this.url}SERVICE=WMS&REQUEST=GetMap&LAYERS=${this.name}&VERSION=${this.version}&STYLES=${this.style}&FORMAT=${this.format}&TRANSPARENT=${this.transparent}&BBOX=%bbox&${crsPropName}=${this.crs}&WIDTH=${this.width}&HEIGHT=${this.height}`;
+    const urlObj = new URL(this.url);
+    urlObj.searchParams.set('SERVICE', 'WMS');
+    urlObj.searchParams.set('REQUEST', 'GetMap');
+    urlObj.searchParams.set('LAYERS', this.name);
+    urlObj.searchParams.set('VERSION', this.version);
+    urlObj.searchParams.set('STYLES', this.style);
+    urlObj.searchParams.set('FORMAT', this.format);
+    urlObj.searchParams.set('TRANSPARENT', this.transparent);
+    urlObj.searchParams.set('BBOX', '%bbox');
+    urlObj.searchParams.set(crsPropName, this.crs);
+    urlObj.searchParams.set('WIDTH', this.width);
+    urlObj.searchParams.set('HEIGHT', this.height);
     this.vendorSpecific = source.vendorSpecific;
     for (const name in this.vendorSpecific) {
       if (Object.prototype.hasOwnProperty.call(this.vendorSpecific, name)) {
-        this.url = `${this.url}&${name}=${this.vendorSpecific[name]}`;
+        urlObj.searchParams.set(name, this.vendorSpecific[name]);
       }
     }
+    this.url = decodeURIComponent(urlObj.toString());
   }
-  urlFromExtent(extent) {
+  urlFromExtent(extentOrTile) {
+    const extent = extentOrTile.isExtent ? extentOrTile.as(this.crs, _extent) : extentOrTile.toExtent(this.crs, _extent);
     return URLBuilder.bbox(extent, this);
   }
   extentInsideLimit(extent) {

package/lib/Source/WMTSSource.js

@@ -69,18 +69,24 @@ class WMTSSource extends TMSSource {
     }
     super(source);
     this.isWMTSSource = true;
-
-    // Add ? at the end of the url if it is not already in the given URL
-    if (!this.url.endsWith('?')) {
-      this.url = `${this.url}?`;
-    }
-    this.url = `${this.url}` + `LAYER=${source.name}` + `&FORMAT=${this.format}` + '&SERVICE=WMTS' + `&VERSION=${source.version || '1.0.0'}` + '&REQUEST=GetTile' + `&STYLE=${source.style || 'normal'}` + `&TILEMATRIXSET=${source.tileMatrixSet}` + '&TILEMATRIX=%TILEMATRIX&TILEROW=%ROW&TILECOL=%COL';
+    const urlObj = new URL(this.url);
+    urlObj.searchParams.set('LAYER', source.name);
+    urlObj.searchParams.set('FORMAT', this.format);
+    urlObj.searchParams.set('SERVICE', 'WMTS');
+    urlObj.searchParams.set('VERSION', source.version || '1.0.0');
+    urlObj.searchParams.set('REQUEST', 'GetTile');
+    urlObj.searchParams.set('STYLE', source.style || 'normal');
+    urlObj.searchParams.set('TILEMATRIXSET', source.tileMatrixSet);
+    urlObj.searchParams.set('TILEMATRIX', '%TILEMATRIX');
+    urlObj.searchParams.set('TILEROW', '%ROW');
+    urlObj.searchParams.set('TILECOL', '%COL');
     this.vendorSpecific = source.vendorSpecific;
     for (const name in this.vendorSpecific) {
       if (Object.prototype.hasOwnProperty.call(this.vendorSpecific, name)) {
-        this.url = `${this.url}&${name}=${this.vendorSpecific[name]}`;
+        urlObj.searchParams.set(name, this.vendorSpecific[name]);
       }
     }
+    this.url = decodeURIComponent(urlObj.toString());
   }
 }
 export default WMTSSource;