Merge pull request #195 from mkkellogg/dev

Release v0.3.8: Minor bugfixes
mkkellogg · Apr 9, 2024 · 77b4af2 · 77b4af2
2 parents 0f5b839 + 856a317
commit 77b4af2
Show file tree

Hide file tree

Showing 8 changed files with 187 additions and 104 deletions.
diff --git a/demo/index.html b/demo/index.html
@@ -782,7 +782,7 @@
                 <span id="conversionError" style="color: #ff0000"></span>
             </div>
 
-            <div id ="controls-panel" class="splat-panel" style="height:380px;">
+            <div id ="controls-panel" class="splat-panel" style="height:490px;">
 
                 <br>
                 <span class="small-title">Mouse input</span>
@@ -813,7 +813,7 @@
                         </td>
                     </tr>
                     <tr>
-                        <td><div class ="controls-key">P</div></td>
+                        <td><div class ="controls-key">U</div></td>
                         <td class="controls-key-description">Toggle controls orientation marker</td>
                     </tr>
                     <tr>
@@ -832,6 +832,38 @@
                         <td><div class ="controls-key" style="font-size:13pt; font-weight: bold;">&rarr;</div></td>
                         <td class="controls-key-description">Rotate camera-up clockwise</td>
                     </tr>
+                    <tr>
+                      <td colspan="2" style="height:1px">
+                      </td>
+                    </tr>
+                    <tr>
+                        <td><div class ="controls-key">P</div></td>
+                        <td class="controls-key-description">Toggle point-cloud mode</td>
+                    </tr>
+                    <tr>
+                      <td colspan="2" style="height:1px">
+                      </td>
+                    </tr>
+                    <tr>
+                        <td><div class ="controls-key">O</div></td>
+                        <td class="controls-key-description">Toggle orthographic mode</td>
+                    </tr>
+                    <tr>
+                      <td colspan="2" style="height:1px">
+                      </td>
+                    </tr>
+                    <tr>
+                        <td><div class ="controls-key">=</div></td>
+                        <td class="controls-key-description">Increase splat scale</td>
+                    </tr>
+                    <tr>
+                      <td colspan="2" style="height:1px">
+                      </td>
+                    </tr>
+                    <tr>
+                        <td><div class ="controls-key">-</div></td>
+                        <td class="controls-key-description">Decrease splat scale</td>
+                    </tr>
                 </table>
             </div>
         </div>

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -4,7 +4,7 @@
         "type": "git",
         "url": "https://github.com/mkkellogg/GaussianSplats3D"
     },
-    "version": "0.3.7",
+    "version": "0.3.8",
     "description": "Three.js-based 3D Gaussian splat viewer",
     "module": "build/gaussian-splats-3d.module.js",
     "main": "build/gaussian-splats-3d.umd.cjs",

diff --git a/src/DropInViewer.js b/src/DropInViewer.js
@@ -19,6 +19,7 @@ export class DropInViewer extends THREE.Group {
         options.renderer = undefined;
 
         this.viewer = new Viewer(options);
+        this.splatMesh = null;
 
         this.callbackMesh = DropInViewer.createCallbackMesh();
         this.add(this.callbackMesh);
@@ -49,11 +50,7 @@ export class DropInViewer extends THREE.Group {
      */
     addSplatScene(path, options = {}) {
         if (options.showLoadingUI !== false) options.showLoadingUI = true;
-        const loadPromise = this.viewer.addSplatScene(path, options);
-        loadPromise.then(() => {
-            this.add(this.viewer.splatMesh);
-        });
-        return loadPromise;
+        return this.viewer.addSplatScene(path, options);
     }
 
     /**
@@ -76,11 +73,7 @@ export class DropInViewer extends THREE.Group {
      */
     addSplatScenes(sceneOptions, showLoadingUI) {
         if (showLoadingUI !== false) showLoadingUI = true;
-        const loadPromise = this.viewer.addSplatScenes(sceneOptions, showLoadingUI);
-        loadPromise.then(() => {
-            this.add(this.viewer.splatMesh);
-        });
-        return loadPromise;
+        return this.viewer.addSplatScenes(sceneOptions, showLoadingUI);
     }
 
     /**
@@ -92,11 +85,22 @@ export class DropInViewer extends THREE.Group {
         return this.viewer.getSplatScene(sceneIndex);
     }
 
+    removeSplatScene(index) {
+        return this.viewer.removeSplatScene(index);
+    }
+
     dispose() {
         return this.viewer.dispose();
     }
 
     static onBeforeRender(viewer, renderer, threeScene, camera) {
+        if (this.splatMesh !== this.viewer.splatMesh) {
+            if (this.splatMesh) {
+                this.remove(this.splatMesh);
+            }
+            this.splatMesh = this.viewer.splatMesh;
+            this.add(this.viewer.splatMesh);
+        }
         viewer.update(renderer, camera);
     }
 

diff --git a/src/SplatMesh.js b/src/SplatMesh.js
@@ -96,6 +96,7 @@ export class SplatMesh extends THREE.Mesh {
 
         this.disposed = false;
         this.lastRenderer = null;
+        this.visible = false;
     }
 
     /**
@@ -672,16 +673,28 @@ export class SplatMesh extends THREE.Mesh {
         }
         this.scenes = newScenes;
 
+        let splatBuffersChanged = false;
+        if (splatBuffers.length !== this.lastBuildScenes.length) {
+            splatBuffersChanged = true;
+        } else {
+            for (let i = 0; i < splatBuffers.length; i++) {
+                const splatBuffer = splatBuffers[i];
+                if (splatBuffer !== this.lastBuildScenes[i].splatBuffer) {
+                    splatBuffersChanged = true;
+                    break;
+                }
+            }
+        }
+
         let isUpdateBuild = true;
-        if (this.scenes.length > 1 ||
+        if (this.scenes.length !== 1 ||
             this.lastBuildSceneCount !== this.scenes.length ||
             this.lastBuildMaxSplatCount !== maxSplatCount ||
-            this.scenes[0].splatBuffer !== this.lastBuildScenes[0].splatBuffer) {
+            splatBuffersChanged) {
                 isUpdateBuild = false;
        }
 
        if (!isUpdateBuild) {
-            isUpdateBuild = false;
             this.boundingBox = new THREE.Box3();
             this.maxSplatDistanceFromSceneCenter = 0;
             this.visibleRegionBufferRadius = 0;
@@ -723,14 +736,16 @@ export class SplatMesh extends THREE.Mesh {
         this.lastBuildMaxSplatCount = this.getMaxSplatCount();
         this.lastBuildSceneCount = this.scenes.length;
 
-        if (finalBuild) {
+        if (finalBuild && this.scenes.length > 0) {
             this.buildSplatTree(sceneOptions.map(options => options.splatAlphaRemovalThreshold || 1),
                                 onSplatTreeIndexesUpload, onSplatTreeConstruction)
             .then(() => {
                 if (this.onSplatTreeReadyCallback) this.onSplatTreeReadyCallback(this.splatTree);
             });
         }
 
+        this.visible = (this.scenes.length > 0);
+
         return buildResults;
     }
 
@@ -789,6 +804,7 @@ export class SplatMesh extends THREE.Mesh {
 
         this.disposed = true;
         this.lastRenderer = null;
+        this.visible = false;
     }
 
     /**
@@ -819,10 +835,13 @@ export class SplatMesh extends THREE.Mesh {
     }
 
     disposeSplatTree() {
-        if (this.splatTree) this.splatTree.dispose();
-        this.splatTree = null;
-        if (this.baseSplatTree) this.baseSplatTree.dispose();
-        this.baseSplatTree = null;
+        if (this.splatTree) {
+            this.splatTree.dispose();
+            this.splatTree = null;
+        } else if (this.baseSplatTree) {
+            this.baseSplatTree.dispose();
+            this.baseSplatTree = null;
+        }
     }
 
     getSplatTree() {