@d5techs/3dgs-lib 1.4.76 → 1.4.78

package/dist/3dgs-lib.js

@@ -17577,7 +17577,7 @@ class SphereSelection {
     this.toolbar = document.createElement("div");
     this.toolbar.className = "volume-select-toolbar";
     this.toolbar.style.cssText = `
-      position:absolute; bottom:12px; left:50%; transform:translateX(-50%);
+      position:absolute; bottom:90px; left:50%; transform:translateX(-50%);
       display:none; z-index:20; background:rgba(30,30,30,0.92);
       border-radius:8px; padding:6px 10px; gap:6px;
       align-items:center; font-size:13px; color:#ddd;
@@ -17668,7 +17668,7 @@ class BoxSelection {
     this.toolbar = document.createElement("div");
     this.toolbar.className = "volume-select-toolbar";
     this.toolbar.style.cssText = `
-      position:absolute; bottom:12px; left:50%; transform:translateX(-50%);
+      position:absolute; bottom:90px; left:50%; transform:translateX(-50%);
       display:none; z-index:20; background:rgba(30,30,30,0.92);
       border-radius:8px; padding:6px 10px; gap:6px;
       align-items:center; font-size:13px; color:#ddd;
@@ -17875,8 +17875,10 @@ function exportEditedPLY(positions, scales, rotations, colors, opacities, shCoef
   }
   return buffer;
 }
-const SPHERE_SEGMENTS = 64;
-const SPHERE_RINGS = 3;
+const SEG = 64;
+const LAT_COUNT = 8;
+const LON_COUNT = 12;
+const BOX_GRID_SUBDIV = 4;
 class SelectionVolumeRenderer {
   constructor(renderer, camera) {
     __publicField(this, "renderer");
@@ -17887,16 +17889,14 @@ class SelectionVolumeRenderer {
     __publicField(this, "vertexBuffer", null);
     __publicField(this, "_volume", { type: null, center: [0, 0, 0], dimensions: [2, 2, 2] });
     __publicField(this, "vertexCount", 0);
-    __publicField(this, "maxVertices");
-    __publicField(this, "lineColor", [0.2, 0.8, 1]);
+    __publicField(this, "lineColor", [0.4, 0.9, 1]);
     this.renderer = renderer;
     this.camera = camera;
-    this.maxVertices = Math.max(
-      24,
-      SPHERE_SEGMENTS * 2 * SPHERE_RINGS
-    );
     this.createPipeline();
-    this.createVertexBuffer();
+    this.vertexBuffer = this.renderer.device.createBuffer({
+      size: 65536,
+      usage: GPUBufferUsage.VERTEX | GPUBufferUsage.COPY_DST
+    });
   }
   get volume() {
     return this._volume;
@@ -17930,7 +17930,7 @@ class SelectionVolumeRenderer {
         return o;
       }
       @fragment fn fs(i: VO) -> @location(0) vec4<f32> {
-        return vec4(i.color, 0.8);
+        return vec4(i.color, 0.6);
       }
     `
     );
@@ -17968,78 +17968,115 @@ class SelectionVolumeRenderer {
       depthStencil: { format: this.renderer.depthFormat, depthWriteEnabled: false, depthCompare: "always" }
     });
   }
-  createVertexBuffer() {
-    const size = this.maxVertices * 24;
-    this.vertexBuffer = this.renderer.device.createBuffer({
-      size,
-      usage: GPUBufferUsage.VERTEX | GPUBufferUsage.COPY_DST
-    });
-  }
+  // ========== Box: 12 edges + grid lines on all 6 faces ==========
   generateBoxVertices() {
     const [cx, cy, cz] = this._volume.center;
     const [lx, ly, lz] = this._volume.dimensions;
     const hx = lx / 2, hy = ly / 2, hz = lz / 2;
     const [r, g, b] = this.lineColor;
     const v = [];
-    const addLine = (x12, y12, z12, x2, y2, z2) => {
+    const line = (x12, y12, z12, x2, y2, z2) => {
       v.push(x12, y12, z12, r, g, b, x2, y2, z2, r, g, b);
     };
     const x0 = cx - hx, x1 = cx + hx;
     const y0 = cy - hy, y1 = cy + hy;
     const z0 = cz - hz, z1 = cz + hz;
-    addLine(x0, y0, z0, x1, y0, z0);
-    addLine(x1, y0, z0, x1, y0, z1);
-    addLine(x1, y0, z1, x0, y0, z1);
-    addLine(x0, y0, z1, x0, y0, z0);
-    addLine(x0, y1, z0, x1, y1, z0);
-    addLine(x1, y1, z0, x1, y1, z1);
-    addLine(x1, y1, z1, x0, y1, z1);
-    addLine(x0, y1, z1, x0, y1, z0);
-    addLine(x0, y0, z0, x0, y1, z0);
-    addLine(x1, y0, z0, x1, y1, z0);
-    addLine(x1, y0, z1, x1, y1, z1);
-    addLine(x0, y0, z1, x0, y1, z1);
+    line(x0, y0, z0, x1, y0, z0);
+    line(x1, y0, z0, x1, y0, z1);
+    line(x1, y0, z1, x0, y0, z1);
+    line(x0, y0, z1, x0, y0, z0);
+    line(x0, y1, z0, x1, y1, z0);
+    line(x1, y1, z0, x1, y1, z1);
+    line(x1, y1, z1, x0, y1, z1);
+    line(x0, y1, z1, x0, y1, z0);
+    line(x0, y0, z0, x0, y1, z0);
+    line(x1, y0, z0, x1, y1, z0);
+    line(x1, y0, z1, x1, y1, z1);
+    line(x0, y0, z1, x0, y1, z1);
+    const n = BOX_GRID_SUBDIV;
+    for (let i = 1; i < n; i++) {
+      const t = i / n;
+      const px = x0 + (x1 - x0) * t;
+      const pz = z0 + (z1 - z0) * t;
+      line(px, y0, z0, px, y0, z1);
+      line(px, y1, z0, px, y1, z1);
+      line(x0, y0, pz, x1, y0, pz);
+      line(x0, y1, pz, x1, y1, pz);
+    }
+    for (let i = 1; i < n; i++) {
+      const t = i / n;
+      const px = x0 + (x1 - x0) * t;
+      const py = y0 + (y1 - y0) * t;
+      line(px, y0, z0, px, y1, z0);
+      line(px, y0, z1, px, y1, z1);
+      line(x0, py, z0, x1, py, z0);
+      line(x0, py, z1, x1, py, z1);
+    }
+    for (let i = 1; i < n; i++) {
+      const t = i / n;
+      const py = y0 + (y1 - y0) * t;
+      const pz = z0 + (z1 - z0) * t;
+      line(x0, py, z0, x0, py, z1);
+      line(x1, py, z0, x1, py, z1);
+      line(x0, y0, pz, x0, y1, pz);
+      line(x1, y0, pz, x1, y1, pz);
+    }
     return new Float32Array(v);
   }
+  // ========== Sphere: latitude + longitude rings ==========
   generateSphereVertices() {
     const [cx, cy, cz] = this._volume.center;
     const radius = this._volume.dimensions[0];
     const [r, g, b] = this.lineColor;
     const v = [];
-    const seg = SPHERE_SEGMENTS;
-    const addCircle = (axis) => {
-      for (let i = 0; i < seg; i++) {
-        const a0 = i / seg * Math.PI * 2;
-        const a1 = (i + 1) / seg * Math.PI * 2;
-        let x0, y0, z0, x1, y1, z1;
-        if (axis === "y") {
-          x0 = cx + Math.cos(a0) * radius;
-          y0 = cy;
-          z0 = cz + Math.sin(a0) * radius;
-          x1 = cx + Math.cos(a1) * radius;
-          y1 = cy;
-          z1 = cz + Math.sin(a1) * radius;
-        } else if (axis === "x") {
-          x0 = cx;
-          y0 = cy + Math.cos(a0) * radius;
-          z0 = cz + Math.sin(a0) * radius;
-          x1 = cx;
-          y1 = cy + Math.cos(a1) * radius;
-          z1 = cz + Math.sin(a1) * radius;
-        } else {
-          x0 = cx + Math.cos(a0) * radius;
-          y0 = cy + Math.sin(a0) * radius;
-          z0 = cz;
-          x1 = cx + Math.cos(a1) * radius;
-          y1 = cy + Math.sin(a1) * radius;
-          z1 = cz;
-        }
-        v.push(x0, y0, z0, r, g, b, x1, y1, z1, r, g, b);
+    const addRing = (centerY, ringRadius) => {
+      for (let i = 0; i < SEG; i++) {
+        const a0 = i / SEG * Math.PI * 2;
+        const a1 = (i + 1) / SEG * Math.PI * 2;
+        v.push(
+          cx + Math.cos(a0) * ringRadius,
+          cy + centerY,
+          cz + Math.sin(a0) * ringRadius,
+          r,
+          g,
+          b,
+          cx + Math.cos(a1) * ringRadius,
+          cy + centerY,
+          cz + Math.sin(a1) * ringRadius,
+          r,
+          g,
+          b
+        );
       }
     };
-    addCircle("x");
-    addCircle("y");
-    addCircle("z");
+    for (let i = 0; i <= LAT_COUNT; i++) {
+      const phi = -Math.PI / 2 + i / LAT_COUNT * Math.PI;
+      const y = Math.sin(phi) * radius;
+      const ringR = Math.cos(phi) * radius;
+      if (ringR < 1e-3) continue;
+      addRing(y, ringR);
+    }
+    for (let j = 0; j < LON_COUNT; j++) {
+      const theta = j / LON_COUNT * Math.PI;
+      for (let i = 0; i < SEG; i++) {
+        const phi0 = i / SEG * Math.PI * 2;
+        const phi1 = (i + 1) / SEG * Math.PI * 2;
+        v.push(
+          cx + Math.cos(phi0) * Math.sin(theta) * radius,
+          cy + Math.sin(phi0) * radius,
+          cz + Math.cos(phi0) * Math.cos(theta) * radius,
+          r,
+          g,
+          b,
+          cx + Math.cos(phi1) * Math.sin(theta) * radius,
+          cy + Math.sin(phi1) * radius,
+          cz + Math.cos(phi1) * Math.cos(theta) * radius,
+          r,
+          g,
+          b
+        );
+      }
+    }
     return new Float32Array(v);
   }
   render(pass) {
@@ -18152,9 +18189,17 @@ class SplatEditor {
       this.toolOverlay.style.display = name && !isVolumeTool ? "block" : "none";
       if (isVolumeTool && this.volumeRenderer) {
         const volType = name;
-        const center = this.getModelCenter();
-        const dims = volType === "box" ? [this.boxTool.lenX, this.boxTool.lenY, this.boxTool.lenZ] : [this.sphereTool.radius, 0, 0];
-        this.volumeRenderer.setVolume(volType, center, dims);
+        const bounds = this.getModelBounds();
+        const defaultSize = Math.max(bounds.size[0], bounds.size[1], bounds.size[2]) * 0.3;
+        const safeSize = Math.max(defaultSize, 0.5);
+        if (volType === "box") {
+          this.boxTool.setDimensions(safeSize, safeSize, safeSize);
+          this.volumeRenderer.setVolume("box", bounds.center, [safeSize, safeSize, safeSize]);
+        } else {
+          const r = safeSize / 2;
+          this.sphereTool.setRadius(r);
+          this.volumeRenderer.setVolume("sphere", bounds.center, [r, 0, 0]);
+        }
         (_b2 = (_a2 = this.callbacks).onVolumeToolActivated) == null ? void 0 : _b2.call(_a2, this.volumeRenderer.volume);
       } else {
         if (this.volumeRenderer) this.volumeRenderer.setVolume(null);
@@ -18571,24 +18616,36 @@ class SplatEditor {
     };
   }
   /**
-   * 获取模型包围盒中心（世界空间）
+   * 获取模型世界空间包围盒（中心 + 尺寸）
    */
-  getModelCenter() {
+  getModelBounds() {
     const cpuPos = this.gsRenderer.getCPUPositions();
-    if (!cpuPos || cpuPos.length === 0) return [0, 0, 0];
+    if (!cpuPos || cpuPos.length === 0) return { center: [0, 0, 0], size: [2, 2, 2] };
     const modelMat = this.gsRenderer.getModelMatrix();
     const count = this.splatState.count;
-    let sx = 0, sy = 0, sz = 0, n = 0;
-    const step = Math.max(1, Math.floor(count / 1e3));
+    let minX = Infinity, minY = Infinity, minZ = Infinity;
+    let maxX = -Infinity, maxY = -Infinity, maxZ = -Infinity;
+    const step = Math.max(1, Math.floor(count / 2e3));
     for (let i = 0; i < count; i += step) {
       const i3 = i * 3;
       const lx = cpuPos[i3], ly = cpuPos[i3 + 1], lz = cpuPos[i3 + 2];
-      sx += modelMat[0] * lx + modelMat[4] * ly + modelMat[8] * lz + modelMat[12];
-      sy += modelMat[1] * lx + modelMat[5] * ly + modelMat[9] * lz + modelMat[13];
-      sz += modelMat[2] * lx + modelMat[6] * ly + modelMat[10] * lz + modelMat[14];
-      n++;
+      const wx = modelMat[0] * lx + modelMat[4] * ly + modelMat[8] * lz + modelMat[12];
+      const wy = modelMat[1] * lx + modelMat[5] * ly + modelMat[9] * lz + modelMat[13];
+      const wz = modelMat[2] * lx + modelMat[6] * ly + modelMat[10] * lz + modelMat[14];
+      if (wx < minX) minX = wx;
+      if (wx > maxX) maxX = wx;
+      if (wy < minY) minY = wy;
+      if (wy > maxY) maxY = wy;
+      if (wz < minZ) minZ = wz;
+      if (wz > maxZ) maxZ = wz;
     }
-    return n > 0 ? [sx / n, sy / n, sz / n] : [0, 0, 0];
+    return {
+      center: [(minX + maxX) / 2, (minY + maxY) / 2, (minZ + maxZ) / 2],
+      size: [maxX - minX, maxY - minY, maxZ - minZ]
+    };
+  }
+  getModelCenter() {
+    return this.getModelBounds().center;
   }
   /**
    * 根据屏幕像素坐标，找到最近的可见 splat 并返回其世界坐标及深度换算系数