diff --git a/examples/3dtiles.html b/examples/3dtiles.html index 2450abc63d..56e31f5466 100644 --- a/examples/3dtiles.html +++ b/examples/3dtiles.html @@ -31,8 +31,7 @@ // Create a new Layer 3d-tiles For DiscreteLOD // ------------------------------------------- - var $3dTilesLayerDiscreteLOD = new itowns.GeometryLayer({ id: - '3d-tiles-discrete-lod' }, new itowns.THREE.Group()); + var $3dTilesLayerDiscreteLOD = new itowns.GeometryLayer('3d-tiles-discrete-lod', new itowns.THREE.Group()); $3dTilesLayerDiscreteLOD.name = 'DiscreteLOD'; $3dTilesLayerDiscreteLOD.url = 'https://raw.githubusercontent.com/AnalyticalGraphicsInc/3d-tiles-samples/master/tilesets/TilesetWithDiscreteLOD/tileset.json'; @@ -44,8 +43,7 @@ // Create a new Layer 3d-tiles For Viewer Request Volume // ----------------------------------------------------- - var $3dTilesLayerRequestVolume = new itowns.GeometryLayer({ id: - '3d-tiles-request-volume' }, new itowns.THREE.Group()); + var $3dTilesLayerRequestVolume = new itowns.GeometryLayer('3d-tiles-request-volume', new itowns.THREE.Group()); $3dTilesLayerRequestVolume.name = 'RequestVolume'; $3dTilesLayerRequestVolume.url = 'https://raw.githubusercontent.com/AnalyticalGraphicsInc/3d-tiles-samples/master/tilesets/TilesetWithRequestVolume/tileset.json'; diff --git a/src/Core/Layer/Layer.js b/src/Core/Layer/Layer.js index 760572d71f..8685f4e9c8 100644 --- a/src/Core/Layer/Layer.js +++ b/src/Core/Layer/Layer.js @@ -56,26 +56,31 @@ class Layer extends THREE.EventDispatcher { * layerToListen.addEventListener('opacity-property-changed', (event) => console.log(event)); * @constructor * @protected - * @param {Object} config + * @param {string} id + * @param {string} type + * @param {Object} [config] */ - constructor(config) { + constructor(id, type, config = {}) { super(); Object.assign(this, config); Object.defineProperty(this, 'id', { - value: config.id, + value: id, writable: false, }); Object.defineProperty(this, 'type', { - value: config.type, + value: type, writable: false, }); // Default properties this.options = config.options || {}; + // Does this layer is attached to another one + this.isAttached = false; + if (!this.updateStrategy) { this.updateStrategy = { type: STRATEGY_MIN_NETWORK_TRAFFIC, diff --git a/src/Core/Prefab/Globe/GlobeLayer.js b/src/Core/Prefab/Globe/GlobeLayer.js index 39cae50944..2188422478 100644 --- a/src/Core/Prefab/Globe/GlobeLayer.js +++ b/src/Core/Prefab/Globe/GlobeLayer.js @@ -13,14 +13,15 @@ class GlobeLayer extends TiledGeometryLayer { * * @constructor * + * @param {string} id + * @param {THREE.Object3D} object3d * @param {Object} config - * @param {THREE.Object3D} config.object3d * @param {number} [config.maxSubdivisionLevel=18] * @param {number} [config.sseSubdivisionThreshold=1] * @param {number} [config.maxDeltaElevationLevel=4] */ - constructor(config) { - super(config, config.object3d || new THREE.Group()); + constructor(id, object3d, config = {}) { + super(id, object3d || new THREE.Group(), config); // Configure tiles this.schemeTile = globeSchemeTileWMTS(globeSchemeTile1); diff --git a/src/Core/Prefab/GlobeView.js b/src/Core/Prefab/GlobeView.js index 542297d122..c44db4ef05 100644 --- a/src/Core/Prefab/GlobeView.js +++ b/src/Core/Prefab/GlobeView.js @@ -67,8 +67,7 @@ export const GLOBE_VIEW_EVENTS = { export function createGlobeLayer(id, options = {}) { console.warn('createGlobeLayer is deprecated, use the GlobeLayer class instead.'); - options.id = id; - return new GlobeLayer(options); + return new GlobeLayer(id, options.object3d, options); } /** @@ -102,10 +101,7 @@ function GlobeView(viewerDiv, coordCarto, options = {}) { this.camera.camera3D.updateProjectionMatrix(); this.camera.camera3D.updateMatrixWorld(true); - const wgs84TileLayer = new GlobeLayer({ - id: 'globe', - object3d: options.object3d, - }); + const wgs84TileLayer = new GlobeLayer('globe', options.object3d); const sun = new THREE.DirectionalLight(); sun.position.set(-0.5, 0, 1); diff --git a/src/Core/Prefab/Panorama/PanoramaLayer.js b/src/Core/Prefab/Panorama/PanoramaLayer.js index 5feff0528c..718ef926a0 100644 --- a/src/Core/Prefab/Panorama/PanoramaLayer.js +++ b/src/Core/Prefab/Panorama/PanoramaLayer.js @@ -22,7 +22,7 @@ class PanoramaLayer extends TiledGeometryLayer { * @param {number} [options.maxSubdivisionLevel=10] */ constructor(id, coordinates, type, options) { - super(id, options.object3d || new THREE.Group()); + super(id, options.object3d || new THREE.Group(), options); coordinates.xyz(this.object3d.position); this.object3d.quaternion.setFromUnitVectors( diff --git a/src/Core/Prefab/Planar/PlanarLayer.js b/src/Core/Prefab/Planar/PlanarLayer.js index c6ad0cd989..8ef5a3e36e 100644 --- a/src/Core/Prefab/Planar/PlanarLayer.js +++ b/src/Core/Prefab/Planar/PlanarLayer.js @@ -12,18 +12,18 @@ class PlanarLayer extends TiledGeometryLayer { * * @constructor * + * @param {string} id + * @param {THREE.Object3D} object3d + * @param {Extent} extent - the extent to define the layer within * @param {Object} options - * @param {string} options.id - * @param {Extent} options.extent - the extent to define the layer within - * @param {THREE.Object3D} options.object3d * @param {number} [options.maxSubdivisionLevel=5] * @param {number} [options.maxDeltaElevationLevel=4] */ - constructor(options) { - super(options, options.object3d || new THREE.Group()); + constructor(id, object3d, extent, options = {}) { + super(id, object3d || new THREE.Group(), options); - this.extent = options.extent; - this.schemeTile = [options.extent]; + this.extent = extent; + this.schemeTile = [extent]; function subdivision(context, layer, node) { if (TiledGeometryLayer.hasEnoughTexturesToSubdivide(context, node)) { diff --git a/src/Core/Prefab/PlanarView.js b/src/Core/Prefab/PlanarView.js index eb25969d0c..b5492773ef 100644 --- a/src/Core/Prefab/PlanarView.js +++ b/src/Core/Prefab/PlanarView.js @@ -8,9 +8,7 @@ import PlanarLayer from './Planar/PlanarLayer'; export function createPlanarLayer(id, extent, options) { console.warn('createPlanarLayer is deprecated, use the PlanarLayer class instead.'); - options.id = id; - options.extent = extent; - return new PlanarLayer(options); + return new PlanarLayer(id, options.object3d, extent, options); } function PlanarView(viewerDiv, extent, options = {}) { @@ -33,11 +31,7 @@ function PlanarView(viewerDiv, extent, options = {}) { this.camera.camera3D.updateProjectionMatrix(); this.camera.camera3D.updateMatrixWorld(true); - const tileLayer = new PlanarLayer({ - id: 'planar', - extent, - object3d: options.object3d, - }); + const tileLayer = new PlanarLayer('planar', options.object3d, extent, options); this.addLayer(tileLayer); diff --git a/src/Core/View.js b/src/Core/View.js index 5d0c28bca0..f06ae5bd64 100644 --- a/src/Core/View.js +++ b/src/Core/View.js @@ -110,13 +110,13 @@ View.prototype.constructor = View; function _createLayerFromConfig(config) { switch (config.type) { case 'color': - return new ColorLayer(config); + return new ColorLayer(config.id, config); case 'elevation': - return new ElevationLayer(config); + return new ElevationLayer(config.id, config); case 'geometry': - return new GeometryLayer(config, new THREE.Group()); + return new GeometryLayer(config.id, new THREE.Group(), config); case 'debug': - return new Layer(config); + return new Layer(config.id, 'debug', config); default: throw new Error(`Unknown layer type ${config.type}: please specify a valid one`); @@ -149,12 +149,10 @@ function _preprocessLayer(view, layer, provider, parentLayer) { } if (!layer.whenReady) { - if (layer.type == 'geometry' || layer.type == 'debug') { - if (!layer.object3d) { - // layer.threejsLayer *must* be assigned before preprocessing, - // because TileProvider.preprocessDataLayer function uses it. - layer.threejsLayer = view.mainLoop.gfxEngine.getUniqueThreejsLayer(); - } + if (layer.type == 'debug' && !layer.object3d) { + // layer.threejsLayer *must* be assigned before preprocessing, + // because TileProvider.preprocessDataLayer function uses it. + layer.threejsLayer = view.mainLoop.gfxEngine.getUniqueThreejsLayer(); } let providerPreprocessing = Promise.resolve(); if (provider && provider.preprocessDataLayer) { @@ -594,7 +592,7 @@ View.prototype.pickObjectsAt = function pickObjectsAt(mouseOrEvt, radius, ...whe source; // does this layer have a custom picking function? - if (layer.pickObjectsAt) { + if (!layer.isAttached && layer.pickObjectsAt) { const sp = layer.pickObjectsAt(this, mouse, radius); // warning: sp might be very large, so we can't use '...sp' (we'll hit // 'javascript maximum call stack size exceeded' error) nor diff --git a/src/Layer/ColorLayer.js b/src/Layer/ColorLayer.js index da16bb3e29..079110311b 100644 --- a/src/Layer/ColorLayer.js +++ b/src/Layer/ColorLayer.js @@ -2,8 +2,8 @@ import Layer from '../Core/Layer/Layer'; import { updateLayeredMaterialNodeImagery } from '../Process/LayeredMaterialNodeProcessing'; class ColorLayer extends Layer { - constructor(id) { - super(id, 'color'); + constructor(id, config) { + super(id, 'color', config); this.defineLayerProperty('visible', true); this.defineLayerProperty('opacity', 1.0); diff --git a/src/Layer/ElevationLayer.js b/src/Layer/ElevationLayer.js index 94a314f90a..cf628a0199 100644 --- a/src/Layer/ElevationLayer.js +++ b/src/Layer/ElevationLayer.js @@ -2,8 +2,8 @@ import Layer from '../Core/Layer/Layer'; import { updateLayeredMaterialNodeElevation } from '../Process/LayeredMaterialNodeProcessing'; class ElevationLayer extends Layer { - constructor(id) { - super(id, 'elevation'); + constructor(id, config) { + super(id, 'elevation', config); } update(context, layer, node, parent) { diff --git a/src/Layer/GeometryLayer.js b/src/Layer/GeometryLayer.js index 40830245b4..b25de6e441 100644 --- a/src/Layer/GeometryLayer.js +++ b/src/Layer/GeometryLayer.js @@ -2,8 +2,8 @@ import Layer from '../Core/Layer/Layer'; import Picking from '../Core/Picking'; class GeometryLayer extends Layer { - constructor(config, object3d) { - super(config); + constructor(id, object3d, config) { + super(id, 'geometry', config); if (!object3d || !object3d.isObject3D) { throw new Error(`Missing/Invalid object3d parameter (must be a @@ -11,7 +11,7 @@ class GeometryLayer extends Layer { } if (object3d.type === 'Group' && object3d.name === '') { - object3d.name = config.id; + object3d.name = id; } Object.defineProperty(this, 'object3d', { @@ -62,6 +62,7 @@ class GeometryLayer extends Layer { ${layer.id}`); } this.attachedLayers.push(layer); + layer.isAttached = true; } detach(layer) { diff --git a/src/Layer/TiledGeometryLayer.js b/src/Layer/TiledGeometryLayer.js index b7a117da3a..b4745cccba 100644 --- a/src/Layer/TiledGeometryLayer.js +++ b/src/Layer/TiledGeometryLayer.js @@ -2,8 +2,8 @@ import GeometryLayer from './GeometryLayer'; import Picking from '../Core/Picking'; class TiledGeometryLayer extends GeometryLayer { - constructor(config, object3d) { - super(config, object3d); + constructor(id, object3d, config) { + super(id, object3d, config); this.protocol = 'tile'; this.lighting = {