@xeokit/xeokit-sdk 2.6.96 → 2.6.98

package/dist/xeokit-sdk.es.js

@@ -1,11 +1,11 @@
 /**
- * xeokit-sdk v2.6.96
- *  Commit: c76eb4c08555d55fdd54313f5fb25481d28d1150
- *  Built: 2025-12-02T12:22:54.826Z
+ * xeokit-sdk v2.6.98
+ *  Commit: 30ac0fa9a4eaf6759fe306bb2e332cce49884787
+ *  Built: 2025-12-08T14:33:34.719Z
  */
 
 if (typeof window !== 'undefined') {
-    window.__XEOKIT__ = { version: '2.6.96', commit: 'c76eb4c08555d55fdd54313f5fb25481d28d1150', built: '2025-12-02T12:22:54.826Z' };
+    window.__XEOKIT__ = { version: '2.6.98', commit: '30ac0fa9a4eaf6759fe306bb2e332cce49884787', built: '2025-12-08T14:33:34.719Z' };
 }
 
 /** @private */
@@ -1969,7 +1969,7 @@ const tempVec3a$j = new FloatArrayType(3);
 
 const tempMat1 = new FloatArrayType(16);
 const tempMat2 = new FloatArrayType(16);
-const tempVec4$3 = new FloatArrayType(4);
+const tempVec4$4 = new FloatArrayType(4);
 
 
 /**
@@ -4075,9 +4075,9 @@ const math = {
 
             const sy = math.lenVec3(vec);
 
-            vec[8] = mat[8];
-            vec[9] = mat[9];
-            vec[10] = mat[10];
+            vec[0] = mat[8];
+            vec[1] = mat[9];
+            vec[2] = mat[10];
 
             const sz = math.lenVec3(vec);
 
@@ -5184,7 +5184,7 @@ const math = {
     },
 
     quaternionToAngleAxis(q, angleAxis = math.vec4()) {
-        q = math.normalizeQuaternion(q, tempVec4$3);
+        q = math.normalizeQuaternion(q, tempVec4$4);
         const q3 = q[3];
         const angle = 2 * Math.acos(q3);
         const s = Math.sqrt(1 - q3 * q3);
@@ -9614,6 +9614,7 @@ class Component {
         this._eventCallDepth = 0;
         this._ownedComponents = null;
         this._updateScheduled = false;
+        this._renderer = null;
     }
 }
 
@@ -20658,7 +20659,7 @@ const CompressedMediaType = 10003;
 
 const ids$1 = new Map$1({});
 const tempVec3a$f = math.vec3();
-const tempVec4$2 = math.vec4();
+const tempVec4$3 = math.vec4();
 const TEXTURE_DECODE_FUNCS = { [sRGBEncoding]: "sRGBToLinear" };
 
 const iota$3 = function(n) {
@@ -21078,11 +21079,11 @@ const createLightSetup = function(programVariables, lightsState) {
         const lightUniforms = {
             color: programVariables.createUniform("vec4", `lightColor${i}`, (set) => {
                 const light = lights[i]; // in case it changed
-                tempVec4$2[0] = light.color[0];
-                tempVec4$2[1] = light.color[1];
-                tempVec4$2[2] = light.color[2];
-                tempVec4$2[3] = light.intensity;
-                set(tempVec4$2);
+                tempVec4$3[0] = light.color[0];
+                tempVec4$3[1] = light.color[1];
+                tempVec4$3[2] = light.color[2];
+                tempVec4$3[3] = light.intensity;
+                set(tempVec4$3);
             }),
             position:  programVariables.createUniform("vec3", `lightPos${i}`, (set) => set(lights[i].pos)),
             direction: programVariables.createUniform("vec3", `lightDir${i}`, (set) => set(lights[i].dir)),
@@ -21264,7 +21265,7 @@ const makeInputSetters = function(gl, handle) {
     };
 };
 
-const tempVec4$1 = math.vec4();
+const tempVec4$2 = math.vec4();
 
 const DrawShaderSource = function(meshDrawHash, programVariables, geometry, material, scene) {
     const materialState = material._state;
@@ -21355,10 +21356,10 @@ const DrawShaderSource = function(meshDrawHash, programVariables, geometry, mate
     const materialAlphaModeCutoff = setupUniform("materialAlphaModeCutoff", "vec4",  mtl => {
         const alpha = mtl.alpha;
         if ((alpha !== undefined) && (alpha !== null)) {
-            tempVec4$1[0] = alpha;
-            tempVec4$1[1] = (mtl.alphaMode === 1 ? 1 : 0);
-            tempVec4$1[2] = mtl.alphaCutoff;
-            return tempVec4$1;
+            tempVec4$2[0] = alpha;
+            tempVec4$2[1] = (mtl.alphaMode === 1 ? 1 : 0);
+            tempVec4$2[2] = mtl.alphaCutoff;
+            return tempVec4$2;
         } else {
             return null;
         }
@@ -31844,7 +31845,7 @@ const SnapProgram = function(programVariables, geometry, isSnapInit, isPoints) {
     const coordinateScaler = programVariables.createUniform("vec3", "coordinateScaler", (set, state) => set(state.legacyFrameCtx.snapPickCoordinateScale));
 
     const vWorldPosition = programVariables.createVarying("vec3", "vWorldPosition", () => `${geometry.attributes.position.world}.xyz`);
-    const vPickColor = programVariables.createVarying("vec4", "vPickColor", () => geometry.attributes.pickColor, "flat");
+    const vPickColor = programVariables.createVarying("vec4", "vPickColor", () => geometry.attributes.pickColor); // Using `flat` causes an instability - see XEOK-385 and XEOK-401
 
     const outCoords    = programVariables.createOutput("highp ivec4", "outCoords", 0);
     const outNormal    = programVariables.createOutput("highp ivec4", "outNormal", 1);
@@ -31869,7 +31870,7 @@ const SnapProgram = function(programVariables, geometry, isSnapInit, isPoints) {
 
 const tempVec2 = math.vec2();
 const tempVec3$6 = math.vec3();
-const tempVec4 = math.vec4();
+const tempVec4$1 = math.vec4();
 const tempMat4$2 = math.mat4();
 const vec3zero = math.vec3([0,0,0]);
 
@@ -32352,6 +32353,15 @@ class Layer {
 
     aabbChanged() { this._aabbDirty = true; }
 
+    getAABB() {
+        if (this._aabbDirty) { // Per-layer AABB for best RTC accuracy
+            math.collapseAABB3(this._aabb);
+            this._meshes.forEach(m => math.expandAABB3(this._aabb, m.aabb));
+            this._aabbDirty = false;
+        }
+        return this._aabb;
+    }
+
     __drawLayer(renderFlags, frameCtx, renderer, pass) {
         if ((this._countsByFlag[ENTITY_FLAGS.CULLED].count < this._portions.length) && (this._countsByFlag[ENTITY_FLAGS.VISIBLE].count > 0)) {
             const backfacePasses = (this.primitive !== "points") && (this.primitive !== "lines") && [
@@ -32424,7 +32434,7 @@ class Layer {
     // ---------------------- SILHOUETTE RENDERING -----------------------------------
 
     __drawSilhouette(renderFlags, frameCtx, material, renderPass) {
-        frameCtx.programColor = this.__setVec4FromMaterialColorAlpha(material.fillColor, material.fillAlpha, tempVec4);
+        frameCtx.programColor = this.__setVec4FromMaterialColorAlpha(material.fillColor, material.fillAlpha, tempVec4$1);
         this.__drawLayer(renderFlags, frameCtx, this._renderers.silhouetteRenderer, renderPass);
     }
 
@@ -32470,7 +32480,7 @@ class Layer {
     __drawUniformEdges(renderFlags, frameCtx, material, renderPass) {
         const renderer = this._renderers.edgesRenderers && this._renderers.edgesRenderers.uniform;
         if (renderer) {
-            frameCtx.programColor = this.__setVec4FromMaterialColorAlpha(material.edgeColor, material.edgeAlpha, tempVec4);
+            frameCtx.programColor = this.__setVec4FromMaterialColorAlpha(material.edgeColor, material.edgeAlpha, tempVec4$1);
             this.__drawLayer(renderFlags, frameCtx, renderer, renderPass);
         }
     }
@@ -32517,13 +32527,7 @@ class Layer {
     drawSnap(renderFlags, frameCtx, isSnapInit) {
         frameCtx.snapPickOrigin = [0, 0, 0];
 
-        if (this._aabbDirty) { // Per-layer AABB for best RTC accuracy
-            math.collapseAABB3(this._aabb);
-            this._meshes.forEach(m => math.expandAABB3(this._aabb, m.aabb));
-            this._aabbDirty = false;
-        }
-
-        const aabb = this._aabb;
+        const aabb = this.getAABB();
         frameCtx.snapPickCoordinateScale = math.mulVec3Scalar(
             safeInvVec3([ aabb[3] - aabb[0], aabb[4] - aabb[1], aabb[5] - aabb[2] ]),
             math.MAX_INT);
@@ -40968,34 +40972,37 @@ class SceneModel extends Component {
     /**
      * @private
      */
-    _withEachVisibleLayer(testNumVisibleLayerPortions, cb) {
+    _withEachVisibleLayer(frameCtx, testNumVisibleLayerPortions, cb) {
         if (testNumVisibleLayerPortions && (this.numVisibleLayerPortions === 0)) {
             return;
         }
+        const testLayerCull = frameCtx.testAABB;
         const renderFlags = this.renderFlags;
         for (let i = 0, len = renderFlags.visibleLayers.length; i < len; i++) {
-            const layerIndex = renderFlags.visibleLayers[i];
-            cb(this.layerList[layerIndex]);
-        }
-    }
-
-    drawColorOpaque          (frameCtx) { this._withEachVisibleLayer(false, layer => layer.drawColorOpaque          (this.renderFlags, frameCtx)); }
-    drawColorTransparent     (frameCtx) { this._withEachVisibleLayer(false, layer => layer.drawColorTransparent     (this.renderFlags, frameCtx)); }
-    drawDepth                (frameCtx) { this._withEachVisibleLayer(false, layer => layer.drawDepth                (this.renderFlags, frameCtx)); } // Dedicated to SAO because it skips transparent objects
-    drawSilhouetteXRayed     (frameCtx) { this._withEachVisibleLayer(false, layer => layer.drawSilhouetteXRayed     (this.renderFlags, frameCtx)); }
-    drawSilhouetteHighlighted(frameCtx) { this._withEachVisibleLayer(false, layer => layer.drawSilhouetteHighlighted(this.renderFlags, frameCtx)); }
-    drawSilhouetteSelected   (frameCtx) { this._withEachVisibleLayer(false, layer => layer.drawSilhouetteSelected   (this.renderFlags, frameCtx)); }
-    drawEdgesColorOpaque     (frameCtx) { this._withEachVisibleLayer(false, layer => layer.drawEdgesColorOpaque     (this.renderFlags, frameCtx)); }
-    drawEdgesColorTransparent(frameCtx) { this._withEachVisibleLayer(false, layer => layer.drawEdgesColorTransparent(this.renderFlags, frameCtx)); }
-    drawEdgesXRayed          (frameCtx) { this._withEachVisibleLayer(false, layer => layer.drawEdgesXRayed          (this.renderFlags, frameCtx)); }
-    drawEdgesHighlighted     (frameCtx) { this._withEachVisibleLayer(false, layer => layer.drawEdgesHighlighted     (this.renderFlags, frameCtx)); }
-    drawEdgesSelected        (frameCtx) { this._withEachVisibleLayer(false, layer => layer.drawEdgesSelected        (this.renderFlags, frameCtx)); }
-    drawOcclusion            (frameCtx) { this._withEachVisibleLayer(true,  layer => layer.drawOcclusion            (this.renderFlags, frameCtx)); }
-    drawShadow               (frameCtx) { this._withEachVisibleLayer(true,  layer => layer.drawShadow               (this.renderFlags, frameCtx)); }
-    drawPickMesh             (frameCtx) { this._withEachVisibleLayer(true,  layer => layer.drawPickMesh             (this.renderFlags, frameCtx)); }
-    drawPickDepths           (frameCtx) { this._withEachVisibleLayer(true,  layer => layer.drawPickDepths           (this.renderFlags, frameCtx)); }
-    drawPickNormals          (frameCtx) { this._withEachVisibleLayer(true,  layer => layer.drawPickNormals          (this.renderFlags, frameCtx)); }
-    _drawSnap    (frameCtx, isSnapInit) { this._withEachVisibleLayer(true,  layer => layer.drawSnap                 (this.renderFlags, frameCtx, isSnapInit)); }
+            const layer = this.layerList[renderFlags.visibleLayers[i]];
+            if ((! testLayerCull) || testLayerCull(layer.getAABB())) {
+                cb(layer);
+            }
+        }
+    }
+
+    drawColorOpaque          (frameCtx) { this._withEachVisibleLayer(frameCtx, false, layer => layer.drawColorOpaque          (this.renderFlags, frameCtx)); }
+    drawColorTransparent     (frameCtx) { this._withEachVisibleLayer(frameCtx, false, layer => layer.drawColorTransparent     (this.renderFlags, frameCtx)); }
+    drawDepth                (frameCtx) { this._withEachVisibleLayer(frameCtx, false, layer => layer.drawDepth                (this.renderFlags, frameCtx)); } // Dedicated to SAO because it skips transparent objects
+    drawSilhouetteXRayed     (frameCtx) { this._withEachVisibleLayer(frameCtx, false, layer => layer.drawSilhouetteXRayed     (this.renderFlags, frameCtx)); }
+    drawSilhouetteHighlighted(frameCtx) { this._withEachVisibleLayer(frameCtx, false, layer => layer.drawSilhouetteHighlighted(this.renderFlags, frameCtx)); }
+    drawSilhouetteSelected   (frameCtx) { this._withEachVisibleLayer(frameCtx, false, layer => layer.drawSilhouetteSelected   (this.renderFlags, frameCtx)); }
+    drawEdgesColorOpaque     (frameCtx) { this._withEachVisibleLayer(frameCtx, false, layer => layer.drawEdgesColorOpaque     (this.renderFlags, frameCtx)); }
+    drawEdgesColorTransparent(frameCtx) { this._withEachVisibleLayer(frameCtx, false, layer => layer.drawEdgesColorTransparent(this.renderFlags, frameCtx)); }
+    drawEdgesXRayed          (frameCtx) { this._withEachVisibleLayer(frameCtx, false, layer => layer.drawEdgesXRayed          (this.renderFlags, frameCtx)); }
+    drawEdgesHighlighted     (frameCtx) { this._withEachVisibleLayer(frameCtx, false, layer => layer.drawEdgesHighlighted     (this.renderFlags, frameCtx)); }
+    drawEdgesSelected        (frameCtx) { this._withEachVisibleLayer(frameCtx, false, layer => layer.drawEdgesSelected        (this.renderFlags, frameCtx)); }
+    drawOcclusion            (frameCtx) { this._withEachVisibleLayer(frameCtx, true,  layer => layer.drawOcclusion            (this.renderFlags, frameCtx)); }
+    drawShadow               (frameCtx) { this._withEachVisibleLayer(frameCtx, true,  layer => layer.drawShadow               (this.renderFlags, frameCtx)); }
+    drawPickMesh             (frameCtx) { this._withEachVisibleLayer(frameCtx, true,  layer => layer.drawPickMesh             (this.renderFlags, frameCtx)); }
+    drawPickDepths           (frameCtx) { this._withEachVisibleLayer(frameCtx, true,  layer => layer.drawPickDepths           (this.renderFlags, frameCtx)); }
+    drawPickNormals          (frameCtx) { this._withEachVisibleLayer(frameCtx, true,  layer => layer.drawPickNormals          (this.renderFlags, frameCtx)); }
+    _drawSnap    (frameCtx, isSnapInit) { this._withEachVisibleLayer(frameCtx, true,  layer => layer.drawSnap                 (this.renderFlags, frameCtx, isSnapInit)); }
 
     drawSnapInit(frameCtx) { this._drawSnap(frameCtx, true ); }
     drawSnap    (frameCtx) { this._drawSnap(frameCtx, false); }
@@ -47037,6 +47044,9 @@ const vec3_0 = math.vec3([0,0,0]);
 
 const iota = (n) => { const ret = [ ]; for (let i = 0; i < n; ++i) ret.push(i); return ret; };
 
+const tempPlanes = iota(6).map(() => math.vec4());
+const tempVec4 = math.vec4();
+
 const bitShiftScreenZ = math.vec4([1.0 / (256.0 * 256.0 * 256.0 * 256.0), 1.0 / (256.0 * 256.0 * 256.0), 1.0 / (256.0 * 256.0), 1.0 / 256.0]);
 
 const pixelToInt = pix => pix[0] + (pix[1] << 8) + (pix[2] << 16) + (pix[3] << 24);
@@ -47046,6 +47056,66 @@ const toWorldPos    = (p, origin, scale) => math.vec3([ p[0] * scale[0] + origin
                                                         p[1] * scale[1] + origin[1],
                                                         p[2] * scale[2] + origin[2] ]);
 
+const makeFrustumAABBIntersectionTest = function(camera) {
+    const m = math.mat4();
+    math.mulMat4(camera.projMatrix, camera.viewMatrix, m);
+
+    for (let i = 0; i < 3; ++i) {
+        tempPlanes[i * 2 + 0][0] = m[ 3] + m[i];
+        tempPlanes[i * 2 + 0][1] = m[ 7] + m[i + 4];
+        tempPlanes[i * 2 + 0][2] = m[11] + m[i + 8];
+        tempPlanes[i * 2 + 0][3] = m[15] + m[i + 12];
+
+        tempPlanes[i * 2 + 1][0] = m[ 3] - m[i];
+        tempPlanes[i * 2 + 1][1] = m[ 7] - m[i + 4];
+        tempPlanes[i * 2 + 1][2] = m[11] - m[i + 8];
+        tempPlanes[i * 2 + 1][3] = m[15] - m[i + 12];
+    }
+
+    // Normalize each plane
+    tempPlanes.forEach(p => math.divVec4Scalar(p, math.lenVec3(p), p));
+
+    return aabb => tempPlanes.every(p => {
+        // Compute the positive vertex (farthest in direction of normal)
+        tempVec4[0] = aabb[(p[0] >= 0) ? 3 : 0];
+        tempVec4[1] = aabb[(p[1] >= 0) ? 4 : 1];
+        tempVec4[2] = aabb[(p[2] >= 0) ? 5 : 2];
+        tempVec4[3] = 1;
+        return math.dotVec4(p, tempVec4) >= 0;
+    });
+};
+
+const makeRayAABBIntersectionTest = (O, D) => aabb => {
+    let tmin = -Infinity;
+    let tmax = Infinity;
+
+    for (let i = 0; i < 3; i++) {
+        const origin = O[i];
+        const direction = D[i];
+        const minBound = aabb[i];
+        const maxBound = aabb[i + 3];
+
+        if (Math.abs(direction) < 1e-8) {
+            // Ray is parallel to plane
+            if ((origin < minBound) || (origin > maxBound)) {
+                return false; // No intersection
+            }
+        } else {
+            const t1 = (minBound - origin) / direction;
+            const t2 = (maxBound - origin) / direction;
+
+            tmin = Math.max(tmin, Math.min(t1, t2)); // near
+            tmax = Math.min(tmax, Math.max(t1, t2)); // far
+
+            if (tmin > tmax) {
+                return false; // No intersection
+            }
+        }
+    }
+
+    return tmax >= 0; // Check if intersection is in front of ray
+};
+
 /**
  * @private
  */
@@ -47798,6 +47868,8 @@ const Renderer$1 = function (scene, options) {
             gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
         }
 
+        frameCtx.testAABB = makeFrustumAABBIntersectionTest(scene.camera);
+
         const renderDrawables = function(drawables) {
 
         let normalDrawSAOBinLen = 0;
@@ -48132,6 +48204,8 @@ const Renderer$1 = function (scene, options) {
             renderDrawables(uiDrawableList);
         }
 
+        frameCtx.testAABB = null;
+
         const endTime = Date.now();
         const frameStats = stats.frame;
 
@@ -48240,11 +48314,16 @@ const Renderer$1 = function (scene, options) {
 
                 pickResult.canvasPos = params.canvasPos;
 
+                math.canvasPosToWorldRay(canvas, pickViewMatrix, pickProjMatrix, projection, canvasPos, tempVec3a, tempVec3b);
+                frameCtx.testAABB = makeRayAABBIntersectionTest(tempVec3a, tempVec3b);
             } else {
 
                 // Picking with arbitrary World-space ray
                 // Align camera along ray and fire ray through center of canvas
 
+                canvasPos[0] = canvas.clientWidth * 0.5;
+                canvasPos[1] = canvas.clientHeight * 0.5;
+
                 if (params.matrix) {
 
                     pickViewMatrix = params.matrix;
@@ -48254,6 +48333,8 @@ const Renderer$1 = function (scene, options) {
                     nearAndFar[0] = camera.project.near;
                     nearAndFar[1] = camera.project.far;
 
+                    math.canvasPosToWorldRay(canvas, pickViewMatrix, pickProjMatrix, projection, canvasPos, tempVec3a, tempVec3b);
+                    frameCtx.testAABB = makeRayAABBIntersectionTest(tempVec3a, tempVec3b);
                 } else {
 
                     worldRayOrigin.set(params.origin || [0, 0, 0]);
@@ -48282,10 +48363,9 @@ const Renderer$1 = function (scene, options) {
 
                     pickResult.origin = worldRayOrigin;
                     pickResult.direction = worldRayDir;
-                }
 
-                canvasPos[0] = canvas.clientWidth * 0.5;
-                canvasPos[1] = canvas.clientHeight * 0.5;
+                    frameCtx.testAABB = makeRayAABBIntersectionTest(pickResult.origin, pickResult.direction);
+                }
             }
 
             pickBuffer.bind();
@@ -48322,6 +48402,8 @@ const Renderer$1 = function (scene, options) {
                 renderDrawables(uiDrawableList);
             }
 
+            frameCtx.testAABB = null;
+
             const pickID = pixelToInt(pickBuffer.read(0, 0));
             const pickable = (pickID >= 0) && pickIDs.items[pickID];