@babylonjs/core 7.30.0 → 7.31.0

package/Meshes/GaussianSplatting/gaussianSplattingMesh.d.ts

@@ -5,6 +5,7 @@ import { SubMesh } from "../subMesh";
 import type { AbstractMesh } from "../abstractMesh";
 import { Mesh } from "../mesh";
 import "../thinInstanceMesh.js";
+import type { Material } from "../../Materials/material.js";
 /**
  * Class used to render a gaussian splatting mesh
  */
@@ -28,6 +29,8 @@ export declare class GaussianSplattingMesh extends Mesh {
     private readonly _keepInRam;
     private _delayedTextureUpdate;
     private _oldDirection;
+    private _useRGBACovariants;
+    private _material;
     /**
      * Gets the covariancesA texture
      */
@@ -44,6 +47,14 @@ export declare class GaussianSplattingMesh extends Mesh {
      * Gets the colors texture
      */
     get colorsTexture(): Nullable<BaseTexture>;
+    /**
+     * set rendering material
+     */
+    set material(value: Material);
+    /**
+     * get rendering material
+     */
+    get material(): Nullable<Material>;
     /**
      * Creates a new gaussian splatting mesh
      * @param name defines the name of the mesh

package/Meshes/GaussianSplatting/gaussianSplattingMesh.js

@@ -8,6 +8,8 @@ import { RawTexture } from "../../Materials/Textures/rawTexture.js";
 
 import { Tools } from "../../Misc/tools.js";
 import "../thinInstanceMesh.js";
+import { ToHalfFloat } from "../../Misc/textureTools.js";
+import { Scalar } from "../../Maths/math.scalar.js";
 /**
  * Class used to render a gaussian splatting mesh
  */
@@ -36,6 +38,20 @@ export class GaussianSplattingMesh extends Mesh {
     get colorsTexture() {
         return this._colorsTexture;
     }
+    /**
+     * set rendering material
+     */
+    set material(value) {
+        this._material = value;
+        this._material.backFaceCulling = true;
+        this._material.cullBackFaces = false;
+    }
+    /**
+     * get rendering material
+     */
+    get material() {
+        return this._material;
+    }
     /**
      * Creates a new gaussian splatting mesh
      * @param name defines the name of the mesh
@@ -66,6 +82,8 @@ export class GaussianSplattingMesh extends Mesh {
         this._keepInRam = false;
         this._delayedTextureUpdate = null;
         this._oldDirection = new Vector3();
+        this._useRGBACovariants = false;
+        this._material = null;
         const vertexData = new VertexData();
         vertexData.positions = [-2, -2, 0, 2, -2, 0, 2, 2, 0, -2, 2, 0];
         vertexData.indices = [0, 1, 2, 0, 2, 3];
@@ -73,11 +91,13 @@ export class GaussianSplattingMesh extends Mesh {
         this.subMeshes = [];
         new SubMesh(0, 0, 4, 0, 6, this);
         this.setEnabled(false);
+        // webGL2 and webGPU support for RG texture with float16 is fine. not webGL1
+        this._useRGBACovariants = !this.getEngine().isWebGPU && this.getEngine().version === 1.0;
         this._keepInRam = keepInRam;
         if (url) {
             this.loadFileAsync(url);
         }
-        this.material = new GaussianSplattingMaterial(this.name + "_material", this._scene);
+        this._material = new GaussianSplattingMaterial(this.name + "_material", this._scene);
     }
     /**
      * Returns the class name
@@ -154,10 +174,17 @@ export class GaussianSplattingMesh extends Mesh {
         const headerEnd = "end_header\n";
         const headerEndIndex = header.indexOf(headerEnd);
         if (headerEndIndex < 0 || !header) {
+            // standard splat
             return data;
         }
         const vertexCount = parseInt(/element vertex (\d+)\n/.exec(header)[1]);
-        let rowOffset = 0;
+        const chunkElement = /element chunk (\d+)\n/.exec(header);
+        let chunkCount = 0;
+        if (chunkElement) {
+            chunkCount = parseInt(chunkElement[1]);
+        }
+        let rowVertexOffset = 0;
+        let rowChunkOffset = 0;
         const offsets = {
             double: 8,
             int: 4,
@@ -166,51 +193,207 @@ export class GaussianSplattingMesh extends Mesh {
             short: 2,
             ushort: 2,
             uchar: 1,
+            list: 0,
         };
-        const properties = [];
-        const filtered = header
-            .slice(0, headerEndIndex)
-            .split("\n")
-            .filter((k) => k.startsWith("property "));
+        let ElementMode;
+        (function (ElementMode) {
+            ElementMode[ElementMode["Vertex"] = 0] = "Vertex";
+            ElementMode[ElementMode["Chunk"] = 1] = "Chunk";
+        })(ElementMode || (ElementMode = {}));
+        let chunkMode = 1 /* ElementMode.Chunk */;
+        const vertexProperties = [];
+        const chunkProperties = [];
+        const filtered = header.slice(0, headerEndIndex).split("\n");
         for (const prop of filtered) {
-            const [, type, name] = prop.split(" ");
-            properties.push({ name, type, offset: rowOffset });
-            if (offsets[type]) {
-                rowOffset += offsets[type];
+            if (prop.startsWith("property ")) {
+                const [, type, name] = prop.split(" ");
+                if (chunkMode == 1 /* ElementMode.Chunk */) {
+                    chunkProperties.push({ name, type, offset: rowChunkOffset });
+                    rowChunkOffset += offsets[type];
+                }
+                else if (chunkMode == 0 /* ElementMode.Vertex */) {
+                    vertexProperties.push({ name, type, offset: rowVertexOffset });
+                    rowVertexOffset += offsets[type];
+                }
+                if (!offsets[type]) {
+                    Logger.Warn(`Unsupported property type: ${type}.`);
+                }
             }
-            else {
-                Logger.Error(`Unsupported property type: ${type}. Are you sure it's a valid Gaussian Splatting file?`);
-                return new ArrayBuffer(0);
+            else if (prop.startsWith("element ")) {
+                const [, type] = prop.split(" ");
+                if (type == "chunk") {
+                    chunkMode = 1 /* ElementMode.Chunk */;
+                }
+                else if (type == "vertex") {
+                    chunkMode = 0 /* ElementMode.Vertex */;
+                }
             }
         }
-        const rowLength = 3 * 4 + 3 * 4 + 4 + 4;
+        const rowVertexLength = rowVertexOffset;
+        const rowChunkLength = rowChunkOffset;
+        const rowOutputLength = 3 * 4 + 3 * 4 + 4 + 4; // Vector3 position, Vector3 scale, 1 u8 quaternion, 1 color with alpha
         const SH_C0 = 0.28209479177387814;
+        let offset = 0;
         const dataView = new DataView(data, headerEndIndex + headerEnd.length);
-        const buffer = new ArrayBuffer(rowLength * vertexCount);
+        const buffer = new ArrayBuffer(rowOutputLength * vertexCount);
         const q = new Quaternion();
+        const temp3 = TmpVectors.Vector3[0];
+        const unpackUnorm = (value, bits) => {
+            const t = (1 << bits) - 1;
+            return (value & t) / t;
+        };
+        const unpack111011 = (value, result) => {
+            result.x = unpackUnorm(value >>> 21, 11);
+            result.y = unpackUnorm(value >>> 11, 10);
+            result.z = unpackUnorm(value, 11);
+        };
+        const unpack8888 = (value, result) => {
+            result[0] = unpackUnorm(value >>> 24, 8) * 255;
+            result[1] = unpackUnorm(value >>> 16, 8) * 255;
+            result[2] = unpackUnorm(value >>> 8, 8) * 255;
+            result[3] = unpackUnorm(value, 8) * 255;
+        };
+        // unpack quaternion with 2,10,10,10 format (largest element, 3x10bit element)
+        const unpackRot = (value, result) => {
+            const norm = 1.0 / (Math.sqrt(2) * 0.5);
+            const a = (unpackUnorm(value >>> 20, 10) - 0.5) * norm;
+            const b = (unpackUnorm(value >>> 10, 10) - 0.5) * norm;
+            const c = (unpackUnorm(value, 10) - 0.5) * norm;
+            const m = Math.sqrt(1.0 - (a * a + b * b + c * c));
+            switch (value >>> 30) {
+                case 0:
+                    result.set(m, a, b, c);
+                    break;
+                case 1:
+                    result.set(a, m, b, c);
+                    break;
+                case 2:
+                    result.set(a, b, m, c);
+                    break;
+                case 3:
+                    result.set(a, b, c, m);
+                    break;
+            }
+        };
+        const compressedChunks = new Array(chunkCount);
+        for (let i = 0; i < chunkCount; i++) {
+            const currentChunk = { min: new Vector3(), max: new Vector3(), minScale: new Vector3(), maxScale: new Vector3() };
+            compressedChunks[i] = currentChunk;
+            for (let propertyIndex = 0; propertyIndex < chunkProperties.length; propertyIndex++) {
+                const property = chunkProperties[propertyIndex];
+                let value;
+                switch (property.type) {
+                    case "float":
+                        value = dataView.getFloat32(property.offset + offset, true);
+                        break;
+                    default:
+                        continue;
+                }
+                switch (property.name) {
+                    case "min_x":
+                        currentChunk.min.x = value;
+                        break;
+                    case "min_y":
+                        currentChunk.min.y = value;
+                        break;
+                    case "min_z":
+                        currentChunk.min.z = value;
+                        break;
+                    case "max_x":
+                        currentChunk.max.x = value;
+                        break;
+                    case "max_y":
+                        currentChunk.max.y = value;
+                        break;
+                    case "max_z":
+                        currentChunk.max.z = value;
+                        break;
+                    case "min_scale_x":
+                        currentChunk.minScale.x = value;
+                        break;
+                    case "min_scale_y":
+                        currentChunk.minScale.y = value;
+                        break;
+                    case "min_scale_z":
+                        currentChunk.minScale.z = value;
+                        break;
+                    case "max_scale_x":
+                        currentChunk.maxScale.x = value;
+                        break;
+                    case "max_scale_y":
+                        currentChunk.maxScale.y = value;
+                        break;
+                    case "max_scale_z":
+                        currentChunk.maxScale.z = value;
+                        break;
+                }
+            }
+            offset += rowChunkLength;
+        }
         for (let i = 0; i < vertexCount; i++) {
-            const position = new Float32Array(buffer, i * rowLength, 3);
-            const scale = new Float32Array(buffer, i * rowLength + 12, 3);
-            const rgba = new Uint8ClampedArray(buffer, i * rowLength + 24, 4);
-            const rot = new Uint8ClampedArray(buffer, i * rowLength + 28, 4);
+            const position = new Float32Array(buffer, i * rowOutputLength, 3);
+            const scale = new Float32Array(buffer, i * rowOutputLength + 12, 3);
+            const rgba = new Uint8ClampedArray(buffer, i * rowOutputLength + 24, 4);
+            const rot = new Uint8ClampedArray(buffer, i * rowOutputLength + 28, 4);
+            const chunkIndex = i >> 8;
             let r0 = 255;
             let r1 = 0;
             let r2 = 0;
             let r3 = 0;
-            for (let propertyIndex = 0; propertyIndex < properties.length; propertyIndex++) {
-                const property = properties[propertyIndex];
+            for (let propertyIndex = 0; propertyIndex < vertexProperties.length; propertyIndex++) {
+                const property = vertexProperties[propertyIndex];
                 let value;
                 switch (property.type) {
                     case "float":
-                        value = dataView.getFloat32(property.offset + i * rowOffset, true);
+                        value = dataView.getFloat32(offset + property.offset, true);
                         break;
                     case "int":
-                        value = dataView.getInt32(property.offset + i * rowOffset, true);
+                        value = dataView.getInt32(offset + property.offset, true);
+                        break;
+                    case "uint":
+                        value = dataView.getUint32(offset + property.offset, true);
+                        break;
+                    case "double":
+                        value = dataView.getFloat64(offset + property.offset, true);
+                        break;
+                    case "uchar":
+                        value = dataView.getUint8(offset + property.offset);
                         break;
                     default:
-                        throw new Error(`Unsupported property type: ${property.type}`);
+                        //throw new Error(`Unsupported property type: ${property.type}`);
+                        continue;
                 }
                 switch (property.name) {
+                    case "packed_position":
+                        {
+                            const compressedChunk = compressedChunks[chunkIndex];
+                            unpack111011(value, temp3);
+                            position[0] = Scalar.Lerp(compressedChunk.min.x, compressedChunk.max.x, temp3.x);
+                            position[1] = -Scalar.Lerp(compressedChunk.min.y, compressedChunk.max.y, temp3.y);
+                            position[2] = Scalar.Lerp(compressedChunk.min.z, compressedChunk.max.z, temp3.z);
+                        }
+                        break;
+                    case "packed_rotation":
+                        {
+                            unpackRot(value, q);
+                            r0 = q.w;
+                            r1 = q.z;
+                            r2 = q.y;
+                            r3 = q.x;
+                        }
+                        break;
+                    case "packed_scale":
+                        {
+                            const compressedChunk = compressedChunks[chunkIndex];
+                            unpack111011(value, temp3);
+                            scale[0] = Math.exp(Scalar.Lerp(compressedChunk.minScale.x, compressedChunk.maxScale.x, temp3.x));
+                            scale[1] = Math.exp(Scalar.Lerp(compressedChunk.minScale.y, compressedChunk.maxScale.y, temp3.y));
+                            scale[2] = Math.exp(Scalar.Lerp(compressedChunk.minScale.z, compressedChunk.maxScale.z, temp3.z));
+                        }
+                        break;
+                    case "packed_color":
+                        unpack8888(value, rgba);
+                        break;
                     case "x":
                         position[0] = value;
                         break;
@@ -229,12 +412,15 @@ export class GaussianSplattingMesh extends Mesh {
                     case "scale_2":
                         scale[2] = Math.exp(value);
                         break;
+                    case "diffuse_red":
                     case "red":
                         rgba[0] = value;
                         break;
+                    case "diffuse_green":
                     case "green":
                         rgba[1] = value;
                         break;
+                    case "diffuse_blue":
                     case "blue":
                         rgba[2] = value;
                         break;
@@ -273,6 +459,7 @@ export class GaussianSplattingMesh extends Mesh {
             rot[1] = q.x * 128 + 128;
             rot[2] = q.y * 128 + 128;
             rot[3] = q.z * 128 + 128;
+            offset += rowVertexLength;
         }
         return buffer;
     }
@@ -363,33 +550,48 @@ export class GaussianSplattingMesh extends Mesh {
         this._vertexCount = vertexCount;
         const textureSize = this._getTextureSize(vertexCount);
         const textureLength = textureSize.x * textureSize.y;
-        this._splatPositions = new Float32Array(3 * textureLength);
-        const covA = new Float32Array(3 * textureLength);
-        const covB = new Float32Array(3 * textureLength);
+        this._splatPositions = new Float32Array(4 * textureLength);
+        const covA = new Uint16Array(4 * textureLength);
+        const covB = new Uint16Array((this._useRGBACovariants ? 4 : 2) * textureLength);
         const matrixRotation = TmpVectors.Matrix[0];
         const matrixScale = TmpVectors.Matrix[1];
         const quaternion = TmpVectors.Quaternion[0];
         const minimum = new Vector3(Number.MAX_VALUE, Number.MAX_VALUE, Number.MAX_VALUE);
         const maximum = new Vector3(-Number.MAX_VALUE, -Number.MAX_VALUE, -Number.MAX_VALUE);
+        const covariances = [0, 0, 0, 0, 0, 0];
+        const covBSplatSize = this._useRGBACovariants ? 4 : 2;
         for (let i = 0; i < vertexCount; i++) {
             const x = fBuffer[8 * i + 0];
             const y = -fBuffer[8 * i + 1];
             const z = fBuffer[8 * i + 2];
-            this._splatPositions[3 * i + 0] = x;
-            this._splatPositions[3 * i + 1] = y;
-            this._splatPositions[3 * i + 2] = z;
+            this._splatPositions[4 * i + 0] = x;
+            this._splatPositions[4 * i + 1] = y;
+            this._splatPositions[4 * i + 2] = z;
             minimum.minimizeInPlaceFromFloats(x, y, z);
             maximum.maximizeInPlaceFromFloats(x, y, z);
             quaternion.set((uBuffer[32 * i + 28 + 1] - 128) / 128, (uBuffer[32 * i + 28 + 2] - 128) / 128, (uBuffer[32 * i + 28 + 3] - 128) / 128, -(uBuffer[32 * i + 28 + 0] - 128) / 128);
             quaternion.toRotationMatrix(matrixRotation);
             Matrix.ScalingToRef(fBuffer[8 * i + 3 + 0] * 2, fBuffer[8 * i + 3 + 1] * 2, fBuffer[8 * i + 3 + 2] * 2, matrixScale);
             const M = matrixRotation.multiplyToRef(matrixScale, TmpVectors.Matrix[0]).m;
-            covA[i * 3 + 0] = M[0] * M[0] + M[1] * M[1] + M[2] * M[2];
-            covA[i * 3 + 1] = M[0] * M[4] + M[1] * M[5] + M[2] * M[6];
-            covA[i * 3 + 2] = M[0] * M[8] + M[1] * M[9] + M[2] * M[10];
-            covB[i * 3 + 0] = M[4] * M[4] + M[5] * M[5] + M[6] * M[6];
-            covB[i * 3 + 1] = M[4] * M[8] + M[5] * M[9] + M[6] * M[10];
-            covB[i * 3 + 2] = M[8] * M[8] + M[9] * M[9] + M[10] * M[10];
+            covariances[0] = M[0] * M[0] + M[1] * M[1] + M[2] * M[2];
+            covariances[1] = M[0] * M[4] + M[1] * M[5] + M[2] * M[6];
+            covariances[2] = M[0] * M[8] + M[1] * M[9] + M[2] * M[10];
+            covariances[3] = M[4] * M[4] + M[5] * M[5] + M[6] * M[6];
+            covariances[4] = M[4] * M[8] + M[5] * M[9] + M[6] * M[10];
+            covariances[5] = M[8] * M[8] + M[9] * M[9] + M[10] * M[10];
+            // normalize covA, covB
+            let factor = -10000;
+            for (let covIndex = 0; covIndex < 6; covIndex++) {
+                factor = Math.max(factor, Math.abs(covariances[covIndex]));
+            }
+            this._splatPositions[4 * i + 3] = factor;
+            const transform = factor;
+            covA[i * 4 + 0] = ToHalfFloat(covariances[0] / transform);
+            covA[i * 4 + 1] = ToHalfFloat(covariances[1] / transform);
+            covA[i * 4 + 2] = ToHalfFloat(covariances[2] / transform);
+            covA[i * 4 + 3] = ToHalfFloat(covariances[3] / transform);
+            covB[i * covBSplatSize + 0] = ToHalfFloat(covariances[4] / transform);
+            covB[i * covBSplatSize + 1] = ToHalfFloat(covariances[5] / transform);
         }
         // Update the mesh
         const binfo = this.getBoundingInfo();
@@ -399,23 +601,18 @@ export class GaussianSplattingMesh extends Mesh {
         const createTextureFromData = (data, width, height, format) => {
             return new RawTexture(data, width, height, format, this._scene, false, false, 2, 1);
         };
-        const convertRgbToRgba = (rgb) => {
-            const count = rgb.length / 3;
-            const rgba = new Float32Array(count * 4);
-            for (let i = 0; i < count; ++i) {
-                rgba[i * 4 + 0] = rgb[i * 3 + 0];
-                rgba[i * 4 + 1] = rgb[i * 3 + 1];
-                rgba[i * 4 + 2] = rgb[i * 3 + 2];
-                rgba[i * 4 + 3] = 1.0;
-            }
-            return rgba;
+        const createTextureFromDataU8 = (data, width, height, format) => {
+            return new RawTexture(data, width, height, format, this._scene, false, false, 2, 0);
+        };
+        const createTextureFromDataF16 = (data, width, height, format) => {
+            return new RawTexture(data, width, height, format, this._scene, false, false, 2, 2);
         };
-        const colorArray = new Float32Array(textureSize.x * textureSize.y * 4);
+        const colorArray = new Uint8Array(textureSize.x * textureSize.y * 4);
         for (let i = 0; i < this._vertexCount; ++i) {
-            colorArray[i * 4 + 0] = uBuffer[32 * i + 24 + 0] / 255;
-            colorArray[i * 4 + 1] = uBuffer[32 * i + 24 + 1] / 255;
-            colorArray[i * 4 + 2] = uBuffer[32 * i + 24 + 2] / 255;
-            colorArray[i * 4 + 3] = uBuffer[32 * i + 24 + 3] / 255;
+            colorArray[i * 4 + 0] = uBuffer[32 * i + 24 + 0];
+            colorArray[i * 4 + 1] = uBuffer[32 * i + 24 + 1];
+            colorArray[i * 4 + 2] = uBuffer[32 * i + 24 + 2];
+            colorArray[i * 4 + 3] = uBuffer[32 * i + 24 + 3];
         }
         if (this._keepInRam) {
             this._covariancesA = covA;
@@ -423,17 +620,17 @@ export class GaussianSplattingMesh extends Mesh {
             this._colors = colorArray;
         }
         if (this._covariancesATexture) {
-            this._delayedTextureUpdate = { covA: convertRgbToRgba(covA), covB: convertRgbToRgba(covB), colors: colorArray, centers: convertRgbToRgba(this._splatPositions) };
+            this._delayedTextureUpdate = { covA: covA, covB: covB, colors: colorArray, centers: this._splatPositions };
             const positions = Float32Array.from(this._splatPositions);
             const vertexCount = this._vertexCount;
             this._worker.postMessage({ positions, vertexCount }, [positions.buffer]);
             this._postToWorker(true);
         }
         else {
-            this._covariancesATexture = createTextureFromData(convertRgbToRgba(covA), textureSize.x, textureSize.y, 5);
-            this._covariancesBTexture = createTextureFromData(convertRgbToRgba(covB), textureSize.x, textureSize.y, 5);
-            this._centersTexture = createTextureFromData(convertRgbToRgba(this._splatPositions), textureSize.x, textureSize.y, 5);
-            this._colorsTexture = createTextureFromData(colorArray, textureSize.x, textureSize.y, 5);
+            this._covariancesATexture = createTextureFromDataF16(covA, textureSize.x, textureSize.y, 5);
+            this._covariancesBTexture = createTextureFromDataF16(covB, textureSize.x, textureSize.y, this._useRGBACovariants ? 5 : 7);
+            this._centersTexture = createTextureFromData(this._splatPositions, textureSize.x, textureSize.y, 5);
+            this._colorsTexture = createTextureFromDataU8(colorArray, textureSize.x, textureSize.y, 5);
             this._instanciateWorker();
         }
     }
@@ -477,11 +674,17 @@ export class GaussianSplattingMesh extends Mesh {
                 const updateTextureFromData = (texture, data, width, height) => {
                     this.getEngine().updateTextureData(texture.getInternalTexture(), data, 0, 0, width, height, 0, 0, false);
                 };
+                const updateTextureFromDataU8 = (texture, data, width, height) => {
+                    this.getEngine().updateTextureData(texture.getInternalTexture(), data, 0, 0, width, height, 0, 0, false);
+                };
+                const updateTextureFromDataF16 = (texture, data, width, height) => {
+                    this.getEngine().updateTextureData(texture.getInternalTexture(), data, 0, 0, width, height, 0, 0, false);
+                };
                 const textureSize = this._getTextureSize(vertexCount);
-                updateTextureFromData(this._covariancesATexture, this._delayedTextureUpdate.covA, textureSize.x, textureSize.y);
-                updateTextureFromData(this._covariancesBTexture, this._delayedTextureUpdate.covB, textureSize.x, textureSize.y);
+                updateTextureFromDataF16(this._covariancesATexture, this._delayedTextureUpdate.covA, textureSize.x, textureSize.y);
+                updateTextureFromDataF16(this._covariancesBTexture, this._delayedTextureUpdate.covB, textureSize.x, textureSize.y);
                 updateTextureFromData(this._centersTexture, this._delayedTextureUpdate.centers, textureSize.x, textureSize.y);
-                updateTextureFromData(this._colorsTexture, this._delayedTextureUpdate.colors, textureSize.x, textureSize.y);
+                updateTextureFromDataU8(this._colorsTexture, this._delayedTextureUpdate.colors, textureSize.x, textureSize.y);
                 this._delayedTextureUpdate = null;
             }
             this.thinInstanceBufferUpdated("splatIndex");
@@ -539,7 +742,7 @@ GaussianSplattingMesh._CreateWorker = function (self) {
                 depthFactor = 1;
             }
             for (let j = 0; j < vertexCount; j++) {
-                floatMix[2 * j + 1] = 10000 + (viewProj[2] * positions[3 * j + 0] + viewProj[6] * positions[3 * j + 1] + viewProj[10] * positions[3 * j + 2]) * depthFactor;
+                floatMix[2 * j + 1] = 10000 + (viewProj[2] * positions[4 * j + 0] + viewProj[6] * positions[4 * j + 1] + viewProj[10] * positions[4 * j + 2]) * depthFactor;
             }
             depthMix.sort();
             self.postMessage({ depthMix }, [depthMix.buffer]);