itowns 2.44.3-next.22 → 2.44.3-next.24

package/lib/Layer/ElevationLayer.js

@@ -22,14 +22,14 @@ import { RasterElevationTile } from "../Renderer/RasterTile.js";
  * ```
  * @property {number} colorTextureElevationMinZ - elevation minimum in `useColorTextureElevation` mode.
  * @property {number} colorTextureElevationMaxZ - elevation maximum in `useColorTextureElevation` mode.
+ *
+ * @extends RasterLayer
  */
 class ElevationLayer extends RasterLayer {
   /**
    * A simple layer, managing an elevation texture to add some reliefs on the
    * plane or globe view for example.
    *
-   * @extends Layer
-   *
    * @param {string} id - The id of the layer, that should be unique. It is
    * not mandatory, but an error will be emitted if this layer is added a
    * {@link View} that already has a layer going by that id.
@@ -60,14 +60,46 @@ class ElevationLayer extends RasterLayer {
    */
   constructor(id) {
     let config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-    super(id, config);
+    const {
+      scale = 1.0,
+      noDataValue,
+      clampValues,
+      useRgbaTextureElevation,
+      useColorTextureElevation,
+      colorTextureElevationMinZ,
+      colorTextureElevationMaxZ,
+      bias,
+      mode,
+      ...rasterConfig
+    } = config;
+    super(id, rasterConfig);
+
+    /**
+     * @type {boolean}
+     * @readonly
+     */
+    this.isElevationLayer = true;
+    this.noDataValue = noDataValue;
     if (config.zmin || config.zmax) {
       console.warn('Config using zmin and zmax are deprecated, use {clampValues: {min, max}} structure.');
     }
-    this.zmin = config.clampValues?.min ?? config.zmin;
-    this.zmax = config.clampValues?.max ?? config.zmax;
-    this.isElevationLayer = true;
-    this.defineLayerProperty('scale', this.scale || 1.0);
+
+    /**
+     * @type {number | undefined}
+     */
+    this.zmin = clampValues?.min ?? config.zmin;
+
+    /**
+     * @type {number | undefined}
+     */
+    this.zmax = clampValues?.max ?? config.zmax;
+    this.defineLayerProperty('scale', scale);
+    this.useRgbaTextureElevation = useRgbaTextureElevation;
+    this.useColorTextureElevation = useColorTextureElevation;
+    this.colorTextureElevationMinZ = colorTextureElevationMinZ;
+    this.colorTextureElevationMaxZ = colorTextureElevationMaxZ;
+    this.bias = bias;
+    this.mode = mode;
   }
 
   /**

package/lib/Layer/EntwinePointTileLayer.js

@@ -10,13 +10,13 @@ bboxMesh.geometry.boundingBox = box3;
  * @property {boolean} isEntwinePointTileLayer - Used to checkout whether this
  * layer is a EntwinePointTileLayer. Default is `true`. You should not change
  * this, as it is used internally for optimisation.
+ *
+ * @extends PointCloudLayer
  */
 class EntwinePointTileLayer extends PointCloudLayer {
   /**
    * Constructs a new instance of Entwine Point Tile layer.
    *
-   * @extends PointCloudLayer
-   *
    * @example
    * // Create a new point cloud layer
    * const points = new EntwinePointTileLayer('EPT',
@@ -36,15 +36,22 @@ class EntwinePointTileLayer extends PointCloudLayer {
    * contains three elements `name, protocol, extent`, these elements will be
    * available using `layer.name` or something else depending on the property
    * name. See the list of properties to know which one can be specified.
-   * @param {string} [config.crs=ESPG:4326] - The CRS of the {@link View} this
+   * @param {string} [config.crs='ESPG:4326'] - The CRS of the {@link View} this
    * layer will be attached to. This is used to determine the extent of this
    * layer. Default to `EPSG:4326`.
-   * @param {number} [config.skip=1] - Read one point from every `skip` points
-   * - see {@link LASParser}.
    */
   constructor(id, config) {
     super(id, config);
+
+    /**
+     * @type {boolean}
+     * @readonly
+     */
     this.isEntwinePointTileLayer = true;
+
+    /**
+     * @type {THREE.Vector3}
+     */
     this.scale = new THREE.Vector3(1, 1, 1);
     const resolve = this.addInitializationStep();
     this.whenReady = this.source.whenReady.then(() => {

package/lib/Layer/FeatureGeometryLayer.js

@@ -12,10 +12,11 @@ import Feature2Mesh from "../Converter/Feature2Mesh.js";
  * @property {boolean} isFeatureGeometryLayer - Used to checkout whether this layer is
  * a FeatureGeometryLayer. Default is true. You should not change this, as it is used
  * internally for optimisation.
+ *
+ * @extends GeometryLayer
  */
 class FeatureGeometryLayer extends GeometryLayer {
   /**
-   * @extends GeometryLayer
    *
    * @param {string} id - The id of the layer, that should be unique. It is
    * not mandatory, but an error will be emitted if this layer is added a
@@ -28,6 +29,9 @@ class FeatureGeometryLayer extends GeometryLayer {
    * @param {THREE.Object3D} [options.object3d=new THREE.Group()] root object3d layer.
    * @param {function} [options.onMeshCreated] this callback is called when the mesh is created. The callback parameters are the
    * `mesh` and the `context`.
+   * @param {function} [options.filter] callback which filters the features of
+   * this layer. It takes an object with a `properties` property as argument
+   * and shall return a boolean.
    * @param {boolean} [options.accurate=TRUE] If `accurate` is `true`, data are re-projected with maximum geographical accuracy.
    * With `true`, `proj4` is used to transform data source.
    *
@@ -45,14 +49,24 @@ class FeatureGeometryLayer extends GeometryLayer {
    */
   constructor(id) {
     let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-    options.update = FeatureProcessing.update;
-    options.convert = Feature2Mesh.convert({
-      batchId: options.batchId
+    const {
+      object3d,
+      batchId,
+      onMeshCreated,
+      accurate = true,
+      filter,
+      ...geometryOptions
+    } = options;
+    super(id, object3d || new Group(), geometryOptions);
+    this.update = FeatureProcessing.update;
+    this.convert = Feature2Mesh.convert({
+      batchId
     });
-    super(id, options.object3d || new Group(), options);
+    this.onMeshCreated = onMeshCreated;
     this.isFeatureGeometryLayer = true;
-    this.accurate = options.accurate ?? true;
+    this.accurate = accurate;
     this.buildExtent = !this.accurate;
+    this.filter = filter;
   }
   preUpdate(context, sources) {
     if (sources.has(this.parent)) {

package/lib/Layer/GeometryLayer.js

@@ -23,8 +23,6 @@ class GeometryLayer extends Layer {
    * A layer usually managing a geometry to display on a view. For example, it
    * can be a layer of buildings extruded from a a WFS stream.
    *
-   * @extends Layer
-   *
    * @param {string} id - The id of the layer, that should be unique. It is
    * not mandatory, but an error will be emitted if this layer is added a
    * {@link View} that already has a layer going by that id.
@@ -36,7 +34,10 @@ class GeometryLayer extends Layer {
    * contains three elements `name, protocol, extent`, these elements will be
    * available using `layer.name` or something else depending on the property
    * name.
-   * @param {Source} [config.source] - Description and options of the source.
+   * @param {Source} config.source - Description and options of the source.
+   * @param {number} [config.cacheLifeTime=Infinity] - set life time value in cache.
+   * This value is used for [Cache]{@link Cache} expiration mechanism.
+   * @param {boolean} [config.visible]
    *
    * @throws {Error} `object3d` must be a valid `THREE.Object3d`.
    *
@@ -55,12 +56,21 @@ class GeometryLayer extends Layer {
    */
   constructor(id, object3d) {
     let config = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-    config.cacheLifeTime = config.cacheLifeTime ?? CACHE_POLICIES.GEOMETRY;
+    const {
+      cacheLifeTime = CACHE_POLICIES.GEOMETRY,
+      visible = true,
+      opacity = 1.0,
+      ...layerConfig
+    } = config;
+    super(id, {
+      ...layerConfig,
+      cacheLifeTime
+    });
 
-    // Remove this part when Object.assign(this, config) will be removed from Layer Constructor
-    const visible = config.visible;
-    delete config.visible;
-    super(id, config);
+    /**
+     * @type {boolean}
+     * @readonly
+     */
     this.isGeometryLayer = true;
     if (!object3d || !object3d.isObject3D) {
       throw new Error(`Missing/Invalid object3d parameter (must be a
@@ -69,15 +79,36 @@ class GeometryLayer extends Layer {
     if (object3d.type === 'Group' && object3d.name === '') {
       object3d.name = id;
     }
+
+    /**
+     * @type {THREE.Object3D}
+     * @readonly
+     */
+    this.object3d = object3d;
     Object.defineProperty(this, 'object3d', {
-      value: object3d,
       writable: false,
       configurable: true
     });
-    this.opacity = 1.0;
+
+    /**
+     * @type {number}
+     */
+    this.opacity = opacity;
+
+    /**
+     * @type {boolean}
+     */
     this.wireframe = false;
+
+    /**
+     * @type {Layer[]}
+     */
     this.attachedLayers = [];
-    this.visible = visible ?? true;
+
+    /**
+     * @type {boolean}
+     */
+    this.visible = visible;
     Object.defineProperty(this.zoom, 'max', {
       value: Infinity,
       writable: false

package/lib/Layer/LabelLayer.js

@@ -168,17 +168,23 @@ class LabelLayer extends GeometryLayer {
    */
   constructor(id) {
     let config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-    const domElement = config.domElement;
-    delete config.domElement;
-    super(id, config.object3d || new THREE.Group(), config);
+    const {
+      domElement,
+      performance = true,
+      forceClampToTerrain = false,
+      margin,
+      ...geometryConfig
+    } = config;
+    super(id, config.object3d || new THREE.Group(), geometryConfig);
     this.isLabelLayer = true;
     this.domElement = new DomNode();
     this.domElement.show();
     this.domElement.dom.id = `itowns-label-${this.id}`;
     this.buildExtent = true;
     this.crs = config.source.crs;
-    this.performance = config.performance || true;
-    this.forceClampToTerrain = config.forceClampToTerrain || false;
+    this.performance = performance;
+    this.forceClampToTerrain = forceClampToTerrain;
+    this.margin = margin;
     this.toHide = new THREE.Group();
     this.labelDomelement = domElement;
 

package/lib/Layer/Layer.js

@@ -90,62 +90,96 @@ class Layer extends THREE.EventDispatcher {
    */
   constructor(id) {
     let config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-    /* istanbul ignore next */
-    if (config.projection) {
-      console.warn('Layer projection parameter is deprecated, use crs instead.');
-      config.crs = config.crs || config.projection;
-    }
-    if (config.source === undefined || config.source === true) {
-      throw new Error(`Layer ${id} needs Source`);
-    }
+    const {
+      source,
+      name,
+      style = {},
+      subdivisionThreshold = 256,
+      addLabelLayer = false,
+      cacheLifeTime,
+      options = {},
+      updateStrategy,
+      zoom,
+      mergeFeatures = true,
+      crs
+    } = config;
     super();
+
+    /**
+     * @type {boolean}
+     * @readonly
+     */
     this.isLayer = true;
-    if (config.style && !(config.style instanceof Style)) {
-      if (typeof config.style.fill?.pattern === 'string') {
-        console.warn('Using style.fill.pattern = { source: Img|url } is adviced');
-        config.style.fill.pattern = {
-          source: config.style.fill.pattern
-        };
-      }
-      config.style = new Style(config.style);
-    }
-    this.style = config.style || new Style();
-    this.subdivisionThreshold = config.subdivisionThreshold || 256;
-    this.sizeDiagonalTexture = (2 * (this.subdivisionThreshold * this.subdivisionThreshold)) ** 0.5;
-    Object.assign(this, config);
+
+    /**
+     * @type {string}
+     * @readonly
+     */
+    this.id = id;
     Object.defineProperty(this, 'id', {
-      value: id,
       writable: false
     });
-    // Default properties
-    this.options = config.options || {};
-    if (!this.updateStrategy) {
-      this.updateStrategy = {
-        type: STRATEGY_MIN_NETWORK_TRAFFIC,
-        options: {}
-      };
+
+    /**
+     * @type {string}
+     */
+    this.name = name;
+    if (source === undefined || source === true) {
+      throw new Error(`Layer ${id} needs Source`);
     }
-    this.defineLayerProperty('frozen', false);
-    if (config.zoom) {
-      this.zoom = {
-        max: config.zoom.max,
-        min: config.zoom.min || 0
-      };
-      if (this.zoom.max == undefined) {
-        this.zoom.max = Infinity;
+    /**
+     * @type {Source}
+     */
+    this.source = source || new Source({
+      url: 'none'
+    });
+    this.crs = crs;
+    if (style && !(style instanceof Style)) {
+      if (typeof style.fill?.pattern === 'string') {
+        console.warn('Using style.fill.pattern = { source: Img|url } is adviced');
+        style.fill.pattern = {
+          source: style.fill.pattern
+        };
       }
+      this.style = new Style(style);
     } else {
-      this.zoom = {
-        max: Infinity,
-        min: 0
-      };
+      this.style = style || new Style();
     }
+
+    /**
+     * @type {number}
+     */
+    this.subdivisionThreshold = subdivisionThreshold;
+    this.sizeDiagonalTexture = (2 * (this.subdivisionThreshold * this.subdivisionThreshold)) ** 0.5;
+    this.addLabelLayer = addLabelLayer;
+
+    // Default properties
+    this.options = options;
+    this.updateStrategy = updateStrategy ?? {
+      type: STRATEGY_MIN_NETWORK_TRAFFIC,
+      options: {}
+    };
+    this.defineLayerProperty('frozen', false);
+    this.zoom = {
+      min: zoom?.min ?? 0,
+      max: zoom?.max ?? Infinity
+    };
     this.info = new InfoLayer(this);
-    this.source = this.source || new Source({
-      url: 'none'
-    });
+
+    /**
+     * @type {boolean}
+     */
     this.ready = false;
+
+    /**
+     * @type {Array<Promise<any>>}
+     * @protected
+     */
     this._promises = [];
+
+    /**
+     * @type {Promise<this>}
+     */
     this.whenReady = new Promise((re, rj) => {
       this._resolve = re;
       this._reject = rj;
@@ -157,11 +191,12 @@ class Layer extends THREE.EventDispatcher {
       return this;
     });
     this._promises.push(this.source.whenReady);
-    this.cache = new Cache(config.cacheLifeTime);
-    this.mergeFeatures = this.mergeFeatures === undefined ? true : config.mergeFeatures;
 
-    // TODO: verify but this.source.filter seems be always undefined.
-    this.filter = this.filter || this.source.filter;
+    /**
+     * @type {Cache}
+     */
+    this.cache = new Cache(cacheLifeTime);
+    this.mergeFeatures = mergeFeatures;
   }
   addInitializationStep() {
     // Possibility to add rejection handler, if it's necessary.
@@ -243,15 +278,6 @@ class Layer extends THREE.EventDispatcher {
     return data;
   }
 
-  /**
-   * Determines whether the specified feature is valid data.
-   *
-   * @param      {Feature}  feature  The feature
-   * @returns {Feature} the feature is returned if it's valided
-   */
-  // eslint-disable-next-line
-  isValidData() {}
-
   /**
    * Remove and dispose all objects from layer.
    * @param {boolean} [clearCache=false] Whether to clear the layer cache or not

package/lib/Layer/OGC3DTilesLayer.js

@@ -335,7 +335,8 @@ class OGC3DTilesLayer extends GeometryLayer {
     const {
       face,
       index,
-      object
+      object,
+      instanceId
     } = intersects[0];
 
     /** @type{number|null} */
@@ -343,7 +344,7 @@ class OGC3DTilesLayer extends GeometryLayer {
     if (object.isPoints && index) {
       batchId = object.geometry.getAttribute('_BATCHID')?.getX(index) ?? index;
     } else if (object.isMesh && face) {
-      batchId = object.geometry.getAttribute('_BATCHID')?.getX(face.a);
+      batchId = object.geometry.getAttribute('_BATCHID')?.getX(face.a) ?? instanceId;
     }
     if (batchId === undefined) {
       return null;

package/lib/Layer/OrientedImageLayer.js

@@ -96,14 +96,22 @@ class OrientedImageLayer extends GeometryLayer {
    */
   constructor(id) {
     let config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    const {
+      backgroundDistance,
+      background = createBackground(backgroundDistance),
+      onPanoChanged = () => {},
+      getCamerasNameFromFeature = () => {},
+      ...geometryOptions
+    } = config;
+
     /* istanbul ignore next */
     if (config.projection) {
       console.warn('OrientedImageLayer projection parameter is deprecated, use crs instead.');
       config.crs = config.crs || config.projection;
     }
-    super(id, new THREE.Group(), config);
+    super(id, new THREE.Group(), geometryOptions);
     this.isOrientedImageLayer = true;
-    this.background = config.background || createBackground(config.backgroundDistance);
+    this.background = background;
     if (this.background) {
       // Add layer id to easily identify the objects later on (e.g. to delete the geometries when deleting the layer)
       this.background.layer = this.background.layer ?? {};
@@ -115,10 +123,10 @@ class OrientedImageLayer extends GeometryLayer {
     this.currentPano = undefined;
 
     // store a callback to fire event when current panoramic change
-    this.onPanoChanged = config.onPanoChanged || (() => {});
+    this.onPanoChanged = onPanoChanged;
 
     // function to get cameras name from panoramic feature
-    this.getCamerasNameFromFeature = config.getCamerasNameFromFeature || (() => {});
+    this.getCamerasNameFromFeature = getCamerasNameFromFeature;
     const resolve = this.addInitializationStep();
     this.mergeFeatures = false;
     this.filteringExtent = false;

package/lib/Layer/PointCloudLayer.js

@@ -113,6 +113,8 @@ function changeAngleRange(layer) {
  * @property {number} [maxIntensityRange=1] - The maximal intensity of the
  * layer. Changing this value will affect the material, if it has the
  * corresponding uniform. The value is normalized between 0 and 1.
+ *
+ * @extends GeometryLayer
  */
 class PointCloudLayer extends GeometryLayer {
   /**
@@ -120,8 +122,6 @@ class PointCloudLayer extends GeometryLayer {
    * Constructs a new instance of a Point Cloud Layer. This should not be used
    * directly, but rather implemented using `extends`.
    *
-   * @extends GeometryLayer
-   *
    * @param {string} id - The id of the layer, that should be unique. It is
    * not mandatory, but an error will be emitted if this layer is added a
    * {@link View} that already has a layer going by that id.
@@ -130,40 +130,86 @@ class PointCloudLayer extends GeometryLayer {
    * contains three elements `name, protocol, extent`, these elements will be
    * available using `layer.name` or something else depending on the property
    * name. See the list of properties to know which one can be specified.
+   * @param {Source} config.source - Description and options of the source.
    */
   constructor(id) {
     let config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-    super(id, config.object3d || new THREE.Group(), config);
+    const {
+      object3d = new THREE.Group(),
+      group = new THREE.Group(),
+      bboxes = new THREE.Group(),
+      octreeDepthLimit = -1,
+      pointBudget = 2000000,
+      pointSize = 2,
+      sseThreshold = 2,
+      minIntensityRange = 1,
+      maxIntensityRange = 65536,
+      minElevationRange = 0,
+      maxElevationRange = 1000,
+      minAngleRange = -90,
+      maxAngleRange = 90,
+      material = {},
+      mode = PNTS_MODE.COLOR,
+      ...geometryLayerConfig
+    } = config;
+    super(id, object3d, geometryLayerConfig);
+
+    /**
+     * @type {boolean}
+     * @readonly
+     */
     this.isPointCloudLayer = true;
     this.protocol = 'pointcloud';
-    this.group = config.group || new THREE.Group();
+    this.group = group;
     this.object3d.add(this.group);
-    this.bboxes = config.bboxes || new THREE.Group();
+    this.bboxes = bboxes || new THREE.Group();
     this.bboxes.visible = false;
     this.object3d.add(this.bboxes);
     this.group.updateMatrixWorld();
 
     // default config
-    this.octreeDepthLimit = config.octreeDepthLimit || -1;
-    this.pointBudget = config.pointBudget || 2000000;
-    this.pointSize = config.pointSize === 0 || !isNaN(config.pointSize) ? config.pointSize : 4;
-    this.sseThreshold = config.sseThreshold || 2;
-    this.defineLayerProperty('minIntensityRange', config.minIntensityRange || 1, changeIntensityRange);
-    this.defineLayerProperty('maxIntensityRange', config.maxIntensityRange || 65536, changeIntensityRange);
-    this.defineLayerProperty('minElevationRange', config.minElevationRange || 0, changeElevationRange);
-    this.defineLayerProperty('maxElevationRange', config.maxElevationRange || 1000, changeElevationRange);
-    this.defineLayerProperty('minAngleRange', config.minAngleRange || -90, changeAngleRange);
-    this.defineLayerProperty('maxAngleRange', config.maxAngleRange || 90, changeAngleRange);
-    this.material = config.material || {};
+    /**
+     * @type {number}
+     */
+    this.octreeDepthLimit = octreeDepthLimit;
+
+    /**
+     * @type {number}
+     */
+    this.pointBudget = pointBudget;
+
+    /**
+     * @type {number}
+     */
+    this.pointSize = pointSize;
+
+    /**
+     * @type {number}
+     */
+    this.sseThreshold = sseThreshold;
+    this.defineLayerProperty('minIntensityRange', minIntensityRange, changeIntensityRange);
+    this.defineLayerProperty('maxIntensityRange', maxIntensityRange, changeIntensityRange);
+    this.defineLayerProperty('minElevationRange', minElevationRange, changeElevationRange);
+    this.defineLayerProperty('maxElevationRange', maxElevationRange, changeElevationRange);
+    this.defineLayerProperty('minAngleRange', minAngleRange, changeAngleRange);
+    this.defineLayerProperty('maxAngleRange', maxAngleRange, changeAngleRange);
+
+    /**
+     * @type {THREE.Material}
+     */
+    this.material = material;
     if (!this.material.isMaterial) {
-      config.material = config.material || {};
-      config.material.intensityRange = new THREE.Vector2(this.minIntensityRange, this.maxIntensityRange);
-      config.material.elevationRange = new THREE.Vector2(this.minElevationRange, this.maxElevationRange);
-      config.material.angleRange = new THREE.Vector2(this.minAngleRange, this.maxAngleRange);
-      this.material = new PointsMaterial(config.material);
+      this.material.intensityRange = new THREE.Vector2(this.minIntensityRange, this.maxIntensityRange);
+      this.material.elevationRange = new THREE.Vector2(this.minElevationRange, this.maxElevationRange);
+      this.material.angleRange = new THREE.Vector2(this.minAngleRange, this.maxAngleRange);
+      this.material = new PointsMaterial(this.material);
     }
-    this.material.defines = this.material.defines || {};
-    this.mode = config.mode || PNTS_MODE.COLOR;
+    this.mode = mode || PNTS_MODE.COLOR;
+
+    /**
+     * @type {PointCloudNode | undefined}
+     */
+    this.root = undefined;
   }
   preUpdate(context, changeSources) {
     // See https://cesiumjs.org/hosted-apps/massiveworlds/downloads/Ring/WorldScaleTerrainRendering.pptx

package/lib/Layer/Potree2Layer.js

@@ -99,13 +99,13 @@ function parseAttributes(jsonAttributes) {
  * @property {boolean} isPotreeLayer - Used to checkout whether this layer
  * is a Potree2Layer. Default is `true`. You should not change this, as it is
  * used internally for optimisation.
+ *
+ * @extends PointCloudLayer
  */
 class Potree2Layer extends PointCloudLayer {
   /**
    * Constructs a new instance of Potree2 layer.
    *
-   * @extends PointCloudLayer
-   *
    * @example
    * // Create a new point cloud layer
    * const points = new Potree2Layer('points',
@@ -132,6 +132,11 @@ class Potree2Layer extends PointCloudLayer {
    */
   constructor(id, config) {
     super(id, config);
+
+    /**
+     * @type {boolean}
+     * @readonly
+     */
     this.isPotreeLayer = true;
     const resolve = this.addInitializationStep();
     this.source.whenReady.then(metadata => {