itowns 2.44.3-next.4 → 2.44.3-next.5

package/lib/Core/Tile/Tile.js

@@ -0,0 +1,219 @@
+import * as THREE from 'three';
+import Coordinates from "../Geographic/Coordinates.js";
+import CRS from "../Geographic/Crs.js";
+import Extent from "../Geographic/Extent.js";
+import { getInfoTms, getCountTiles } from "./TileGrid.js";
+const _tmsCoord = new THREE.Vector2();
+const _dimensionTile = new THREE.Vector2();
+const r = {
+  row: 0,
+  col: 0,
+  invDiff: 0
+};
+function _rowColfromParent(/** @type {Tile} */tile, /** @type {number} */zoom) {
+  const diffLevel = tile.zoom - zoom;
+  const diff = 2 ** diffLevel;
+  r.invDiff = 1 / diff;
+  r.row = (tile.row - tile.row % diff) * r.invDiff;
+  r.col = (tile.col - tile.col % diff) * r.invDiff;
+  return r;
+}
+const _extent = new Extent('EPSG:4326', [0, 0, 0, 0]);
+const _extent2 = new Extent('EPSG:4326', [0, 0, 0, 0]);
+const _c = new Coordinates('EPSG:4326', 0, 0);
+class Tile {
+  /**
+   * Tile is a geographical bounding rectangle defined by zoom, row and column.
+   *
+   * @param {String} crs projection of limit values.
+   * @param {number} [zoom=0] zoom value
+   * @param {number} [row=0] row value
+   * @param {number} [col=0] column value
+   */
+  constructor(crs) {
+    let zoom = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+    let row = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
+    let col = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;
+    this.isTile = true;
+    this.crs = crs;
+    this.zoom = zoom;
+    this.row = row;
+    this.col = col;
+  }
+
+  /**
+   * Clone this tile
+   * @return {Tile} cloned tile
+   */
+  clone() {
+    return new Tile(this.crs, this.zoom, this.row, this.col);
+  }
+
+  /**
+   * Convert tile to the specified extent.
+   * @param {string} crs the projection of destination.
+   * @param {Extent} target copy the destination to target.
+   * @return {Extent}
+   */
+  toExtent(crs, target) {
+    CRS.isValid(crs);
+    target = target || new Extent('EPSG:4326', [0, 0, 0, 0]);
+    const {
+      epsg,
+      globalExtent,
+      globalDimension
+    } = getInfoTms(this.crs);
+    const countTiles = getCountTiles(this.crs, this.zoom);
+    _dimensionTile.set(1, 1).divide(countTiles).multiply(globalDimension);
+    target.west = globalExtent.west + (globalDimension.x - _dimensionTile.x * (countTiles.x - this.col));
+    target.east = target.west + _dimensionTile.x;
+    target.south = globalExtent.south + _dimensionTile.y * (countTiles.y - this.row - 1);
+    target.north = target.south + _dimensionTile.y;
+    target.crs = epsg;
+    target.zoom = this.zoom;
+    return crs == epsg ? target : target.as(crs, target);
+  }
+
+  /**
+   * Return true if `tile` is inside this tile.
+   *
+   * @param {Tile} tile the tile to check
+   *
+   * @return {boolean}
+   */
+  isInside(tile) {
+    if (this.zoom == tile.zoom) {
+      return this.row == tile.row && this.col == tile.col;
+    } else if (this.zoom < tile.zoom) {
+      return false;
+    } else {
+      _rowColfromParent(this, tile.zoom);
+      return r.row == tile.row && r.col == tile.col;
+    }
+  }
+
+  /**
+   * Return the translation and scale to transform this tile to input tile.
+   *
+   * @param {Tile} tile input tile
+   * @param {THREE.Vector4} target copy the result to target.
+   * @return {THREE.Vector4} {x: translation on west-east, y: translation on south-north, z: scale on west-east, w: scale on south-north}
+   */
+  offsetToParent(tile) {
+    let target = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : new THREE.Vector4();
+    if (this.crs != tile.crs) {
+      throw new Error('unsupported mix');
+    }
+    _rowColfromParent(this, tile.zoom);
+    return target.set(this.col * r.invDiff - r.col, this.row * r.invDiff - r.row, r.invDiff, r.invDiff);
+  }
+
+  /**
+   * Return parent tile with input level
+   *
+   * @param {number} levelParent level of parent.
+   * @return {Tile}
+   */
+  tiledExtentParent(levelParent) {
+    if (levelParent && levelParent < this.zoom) {
+      _rowColfromParent(this, levelParent);
+      return new Tile(this.crs, levelParent, r.row, r.col);
+    } else {
+      return this;
+    }
+  }
+
+  /**
+   * Set zoom, row and column values
+   *
+   * @param {number} [zoom=0] zoom value
+   * @param {number} [row=0] row value
+   * @param {number} [col=0] column value
+   *
+   * @return {Tile}
+   */
+  set() {
+    let zoom = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
+    let row = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+    let col = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
+    this.zoom = zoom;
+    this.row = row;
+    this.col = col;
+    return this;
+  }
+
+  /**
+   * Copy to this tile to input tile.
+   * @param {Tile} tile
+   * @return {Tile} copied extent
+   */
+  copy(tile) {
+    this.crs = tile.crs;
+    return this.set(tile.zoom, tile.row, tile.col);
+  }
+
+  /**
+   * Return values of tile in string, separated by the separator input.
+   * @param {string} separator
+   * @return {string}
+   */
+  toString() {
+    let separator = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+    return `${this.zoom}${separator}${this.row}${separator}${this.col}`;
+  }
+}
+
+/**
+ * @param {Extent} e
+ * @param {string} tms
+ * @returns {Tile[]}
+ */
+export function tiledCovering(e, tms) {
+  if (e.crs == 'EPSG:4326' && tms == CRS.tms_3857) {
+    const WMTS_PM = [];
+    const extent = _extent.copy(e).as(CRS.formatToEPSG(tms), _extent2);
+    const {
+      globalExtent,
+      globalDimension,
+      sTs
+    } = getInfoTms(CRS.formatToEPSG(tms));
+    extent.clampByExtent(globalExtent);
+    extent.planarDimensions(_dimensionTile);
+    const zoom = e.zoom + 1 || Math.floor(Math.log2(Math.round(globalDimension.x / (_dimensionTile.x * sTs.x))));
+    const countTiles = getCountTiles(tms, zoom);
+    const center = extent.center(_c);
+    _tmsCoord.x = center.x - globalExtent.west;
+    _tmsCoord.y = globalExtent.north - extent.north;
+    _tmsCoord.divide(globalDimension).multiply(countTiles).floor();
+
+    // ]N; N+1] => N
+    const maxRow = Math.ceil((globalExtent.north - extent.south) / globalDimension.x * countTiles.y) - 1;
+    for (let r = maxRow; r >= _tmsCoord.y; r--) {
+      WMTS_PM.push(new Tile(tms, zoom, r, _tmsCoord.x));
+    }
+    return WMTS_PM;
+  } else {
+    const target = new Tile(tms, 0, 0, 0);
+    const {
+      globalExtent,
+      globalDimension,
+      sTs,
+      isInverted
+    } = getInfoTms(e.crs);
+    const center = e.center(_c);
+    e.planarDimensions(_dimensionTile);
+    // Each level has 2^n * 2^n tiles...
+    // ... so we count how many tiles of the same width as tile we can fit in the layer
+    // ... 2^zoom = tilecount => zoom = log2(tilecount)
+    const zoom = Math.floor(Math.log2(Math.round(globalDimension.x / (_dimensionTile.x * sTs.x))));
+    const countTiles = getCountTiles(tms, zoom);
+
+    // Now that we have computed zoom, we can deduce x and y (or row / column)
+    _tmsCoord.x = center.x - globalExtent.west;
+    _tmsCoord.y = isInverted ? globalExtent.north - center.y : center.y - globalExtent.south;
+    _tmsCoord.divide(globalDimension).multiply(countTiles).floor();
+    target.set(zoom, _tmsCoord.y, _tmsCoord.x);
+    return [target];
+  }
+}
+export default Tile;

package/lib/Core/Tile/TileGrid.js

@@ -0,0 +1,46 @@
+import * as THREE from 'three';
+import CRS from "../Geographic/Crs.js";
+import Extent from "../Geographic/Extent.js";
+const _countTiles = new THREE.Vector2();
+const _dim = new THREE.Vector2();
+export const globalExtentTMS = new Map();
+export const schemeTiles = new Map();
+const extent4326 = new Extent('EPSG:4326', -180, 180, -90, 90);
+globalExtentTMS.set('EPSG:4326', extent4326);
+
+// Compute global extent of TMS in EPSG:3857
+// It's square whose a side is between -180° to 180°.
+// So, west extent, it's 180 convert in EPSG:3857
+const extent3857 = extent4326.as('EPSG:3857');
+extent3857.clampSouthNorth(extent3857.west, extent3857.east);
+globalExtentTMS.set('EPSG:3857', extent3857);
+schemeTiles.set('default', new THREE.Vector2(1, 1));
+schemeTiles.set(CRS.tms_3857, schemeTiles.get('default'));
+schemeTiles.set(CRS.tms_4326, new THREE.Vector2(2, 1));
+export function getInfoTms(/** @type {string} */crs) {
+  const epsg = CRS.formatToEPSG(crs);
+  const globalExtent = globalExtentTMS.get(epsg);
+  const globalDimension = globalExtent.planarDimensions(_dim);
+  const tms = CRS.formatToTms(crs);
+  const sTs = schemeTiles.get(tms) || schemeTiles.get('default');
+  // The isInverted parameter 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 match the same scheme as OSM, Google Maps or other system.
+  // See link below for more information
+  // https://alastaira.wordpress.com/2011/07/06/converting-tms-tile-coordinates-to-googlebingosm-tile-coordinates/
+  // in crs includes ':NI' => tms isn't inverted (NOT INVERTED)
+  const isInverted = !tms.includes(':NI');
+  return {
+    epsg,
+    globalExtent,
+    globalDimension,
+    sTs,
+    isInverted
+  };
+}
+export function getCountTiles(/** @type {string} */crs, /** @type {number} */zoom) {
+  const sTs = schemeTiles.get(CRS.formatToTms(crs)) || schemeTiles.get('default');
+  const count = 2 ** zoom;
+  _countTiles.set(count, count).multiply(sTs);
+  return _countTiles;
+}

package/lib/Core/TileMesh.js

@@ -1,6 +1,7 @@
 import * as THREE from 'three';
 import CRS from "./Geographic/Crs.js";
 import { geoidLayerIsVisible } from "../Layer/GeoidLayer.js";
+import { tiledCovering } from "./Tile/Tile.js";
 
 /**
  * A TileMesh is a THREE.Mesh with a geometricError and an OBB
@@ -29,7 +30,7 @@ class TileMesh extends THREE.Mesh {
     this.boundingSphere = new THREE.Sphere();
     this.obb.box3D.getBoundingSphere(this.boundingSphere);
     for (const tms of layer.tileMatrixSets) {
-      this.#_tms.set(tms, this.extent.tiledCovering(tms));
+      this.#_tms.set(tms, tiledCovering(this.extent, tms));
     }
     this.frustumCulled = false;
     this.matrixAutoUpdate = false;

package/lib/Layer/LabelLayer.js

@@ -216,17 +216,21 @@ class LabelLayer extends GeometryLayer {
    *
    * @param {FeatureCollection} data - The FeatureCollection to read the
    * labels from.
-   * @param {Extent} extent
+   * @param {Extent|Tile} extentOrTile
    *
    * @return {Label[]} An array containing all the created labels.
    */
-  convert(data, extent) {
+  convert(data, extentOrTile) {
     const labels = [];
 
     // Converting the extent now is faster for further operation
-    extent.as(data.crs, _extent);
+    if (extentOrTile.isExtent) {
+      extentOrTile.as(data.crs, _extent);
+    } else {
+      extentOrTile.toExtent(data.crs, _extent);
+    }
     coord.crs = data.crs;
-    context.setZoom(extent.zoom);
+    context.setZoom(extentOrTile.zoom);
     data.features.forEach(f => {
       // TODO: add support for LINE and POLYGON
       if (f.type !== FEATURE_TYPES.POINT) {

package/lib/Parser/GeoJsonParser.js

@@ -195,7 +195,7 @@ export default {
     _in.crs = _in.crs || readCRS(json);
     if (out.filteringExtent) {
       if (typeof out.filteringExtent == 'boolean') {
-        out.filterExtent = options.extent.as(_in.crs);
+        out.filterExtent = options.extent.isExtent ? options.extent.as(_in.crs) : options.extent.toExtent(_in.crs);
       } else if (out.filteringExtent.isExtent) {
         out.filterExtent = out.filteringExtent;
       }

package/lib/Parser/VectorTileParser.js

@@ -1,7 +1,7 @@
 import { Vector2, Vector3 } from 'three';
 import Protobuf from 'pbf';
 import { VectorTile } from '@mapbox/vector-tile';
-import { globalExtentTMS } from "../Core/Geographic/Extent.js";
+import { globalExtentTMS } from "../Core/Tile/TileGrid.js";
 import { FeatureCollection, FEATURE_TYPES } from "../Core/Feature.js";
 import { deprecatedParsingOptionsToNewOne } from "../Core/Deprecated/Undeprecator.js";
 import Coordinates from "../Core/Geographic/Coordinates.js";

package/lib/Provider/URLBuilder.js

@@ -1,6 +1,9 @@
-import Extent from "../Core/Geographic/Extent.js";
-const extent = new Extent('EPSG:4326', [0, 0, 0, 0]);
 let subDomainsCount = 0;
+
+/**
+ * @param {string} url
+ * @returns {string}
+ */
 function subDomains(url) {
   const subDomainsPtrn = /\$\{u:([\w-_.|]+)\}/.exec(url);
   if (!subDomainsPtrn) {
@@ -51,8 +54,13 @@ export default {
    * // The resulting url is:
    * // http://server.geo/tms/15/2142/3412.jpg;
    *
-   * @param {Extent} coords - the coordinates
-   * @param {Source} source
+   * @param {Object} coords - tile coordinates
+   * @param {number} coords.row - tile row
+   * @param {number} coords.col - tile column
+   * @param {number} coords.zoom - tile zoom
+   * @param {Object} source
+   * @param {string} source.url
+   * @param {Function} source.tileMatrixCallback
    *
    * @return {string} the formed url
    */
@@ -79,8 +87,12 @@ export default {
    * // The resulting url is:
    * // http://server.geo/wms/BBOX=12,35,14,46&FORMAT=jpg&SERVICE=WMS
    *
-   * @param {Extent} bbox - the bounding box
-   * @param {Object} source
+   * @param {Object} bbox - the bounding box
+   * @param {number} bbox.west
+   * @param {number} bbox.south
+   * @param {number} bbox.east
+   * @param {number} bbox.north
+   * @param {Object} source - the source of data
    * @param {string} source.crs
    * @param {number} source.bboxDigits
    * @param {string} source.url
@@ -93,11 +105,10 @@ export default {
     if (source.bboxDigits !== undefined) {
       precision = source.bboxDigits;
     }
-    bbox.as(source.crs, extent);
-    const w = extent.west.toFixed(precision);
-    const s = extent.south.toFixed(precision);
-    const e = extent.east.toFixed(precision);
-    const n = extent.north.toFixed(precision);
+    const w = bbox.west.toFixed(precision);
+    const s = bbox.south.toFixed(precision);
+    const e = bbox.east.toFixed(precision);
+    const n = bbox.north.toFixed(precision);
     let bboxInUnit = source.axisOrder || 'wsen';
     bboxInUnit = bboxInUnit.replace('w', `${w},`).replace('s', `${s},`).replace('e', `${e},`).replace('n', `${n},`).slice(0, -1);
     return subDomains(source.url.replace('%bbox', bboxInUnit));

package/lib/Source/TMSSource.js

@@ -1,8 +1,10 @@
 import Source from "./Source.js";
 import URLBuilder from "../Provider/URLBuilder.js";
-import Extent, { globalExtentTMS } from "../Core/Geographic/Extent.js";
+import Extent from "../Core/Geographic/Extent.js";
+import Tile from "../Core/Tile/Tile.js";
+import { globalExtentTMS } from "../Core/Tile/TileGrid.js";
 import CRS from "../Core/Geographic/Crs.js";
-const extent = new Extent(CRS.tms_4326, 0, 0, 0);
+const _tile = new Tile(CRS.tms_4326, 0, 0, 0);
 
 /**
  * An object defining the source of resources to get from a
@@ -107,8 +109,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 +120,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

@@ -135,8 +135,8 @@ class VectorTilesSource extends TMSSource {
       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
     });

package/lib/Source/WFSSource.js

@@ -1,6 +1,8 @@
 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', [0, 0, 0, 0]);
 
 /**
  * An object defining the source of resources to get from a
@@ -155,7 +157,8 @@ class WFSSource extends Source {
       return [extent.zoom, extent.south, 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,7 @@
 import Source from "./Source.js";
 import URLBuilder from "../Provider/URLBuilder.js";
+import Extent from "../Core/Geographic/Extent.js";
+const _extent = new Extent('EPSG:4326', [0, 0, 0, 0]);
 
 /**
  * An object defining the source of images to get from a
@@ -120,7 +122,8 @@ class WMSSource extends Source {
       }
     }
   }
-  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/package.json

@@ -1,6 +1,6 @@
 {
   "name": "itowns",
-  "version": "2.44.3-next.4",
+  "version": "2.44.3-next.5",
   "description": "A JS/WebGL framework for 3D geospatial data visualization",
   "type": "module",
   "main": "lib/Main.js",