rm-webgpu-compute-tasks 0.0.11 → 0.0.12

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rm-webgpu-compute-tasks",
-  "version": "0.0.11",
+  "version": "0.0.12",
   "description": "",
   "main": "./src/index.js",
   "types": "./src/index.d.ts",

package/src/index.d.ts

@@ -419,7 +419,8 @@ declare function obstacleDetection_(opt: ICreateObstacleDetection): Promise<{
 declare interface Option_2 {
     base: string;
     urls: string[];
-    dilateMaskSize?: number;
+    maskSize?: number;
+    contractionSize?: number;
     kernelSize?: number;
     groundZ?: number;
 }

package/src/index.js

@@ -2216,6 +2216,22 @@ async function trajectoryHandle(baseUrl, trajectoryData) {
     pointCloudArray
   };
 }
+function getPointsCenter(arr) {
+  let x = 0, y = 0, z = 0;
+  for (let i = 0; i < arr.length; i += 3) {
+    x += arr[i];
+    y += arr[i + 1];
+    z += arr[i + 2];
+  }
+  const count = arr.length / 3;
+  return { x: x / count, y: y / count, z: z / count };
+}
+function getPointDistance(p1, p2) {
+  const dx = p2.x - p1.x;
+  const dy = p2.y - p1.y;
+  const dz = p2.z - p1.z;
+  return Math.sqrt(dx * dx + dy * dy + dz * dz);
+}
 class OcclusionMaterial extends ShaderMaterial {
   constructor(opt) {
     super({
@@ -2650,8 +2666,8 @@ class PolyAreaIndexMaterial extends ShaderMaterial {
       side: "none",
       uniforms: {
         imageSize: { value: new Vector2(width, height) }
-      },
-      topology: "point-list"
+      }
+      // topology: "point-list"
     });
     this.resultTexture = resultTexture;
   }
@@ -2851,15 +2867,15 @@ const mainCode$1 = (
     }
 
     // 获取多边形当前坐标有没有点云（获取深度值判断也是一样的， 深度值和点云索引图一一对应）
-    // let packedIndex = textureLoad(pcIndexMap, vec2<i32>(x, y), 0);
-    // let pointIndex = unPackUint(packedIndex); 
-    // if(isEmpty(pointIndex)) {
-    //     return;
-    // }
+    let packedIndex = textureLoad(pcIndexMap, vec2<i32>(x, y), 0);
+    let pointIndex = unPackUint(packedIndex); 
+    if(isEmpty(pointIndex)) {
+        return;
+    }
 
     // 获取当前点云深度值
-    // let depthU32 = pcDepth[idx];
-    // let depthF32 = orderedUintToFloat(depthU32);
+    let depthU32 = pcDepth[idx];
+    let depthF32 = orderedUintToFloat(depthU32);
 
     // 获取范围内最小深度值和对应点云索引
     let maxDepth = 10000.0;
@@ -2894,9 +2910,9 @@ const mainCode$1 = (
     }
 
     // 判断当前点深度和最小深度的差值是否小于阈值
-    // if(abs(depthF32 - minDepth) > depthTol) {
-    //     return;
-    // }
+    if(abs(depthF32 - minDepth) > depthTol) {
+        return;
+    }
 
     let finalPackedIndex = textureLoad(pcIndexMap, minPcUv, 0);
     let finalPointIndex = unPackUint(finalPackedIndex);
@@ -2933,6 +2949,50 @@ class SOPCComputeMaterial extends ComputeMaterial {
     this.uniforms.result.value = this.result;
   }
 }
+function euclideanClusterExtraction(points, distanceThreshold = 0.2, minClusterSize = 1, maxClusterSize = Infinity) {
+  const pointCount = points.length / 3;
+  const visited = new Uint8Array(pointCount);
+  const clusters = [];
+  const thresholdSq = distanceThreshold * distanceThreshold;
+  function distanceSq(a, b) {
+    const ai = a * 3;
+    const bi = b * 3;
+    const dx = points[ai] - points[bi];
+    const dy = points[ai + 1] - points[bi + 1];
+    const dz = points[ai + 2] - points[bi + 2];
+    return dx * dx + dy * dy + dz * dz;
+  }
+  function regionQuery(index) {
+    const neighbors = [];
+    for (let i = 0; i < pointCount; i++) {
+      if (distanceSq(index, i) <= thresholdSq) {
+        neighbors.push(i);
+      }
+    }
+    return neighbors;
+  }
+  for (let i = 0; i < pointCount; i++) {
+    if (visited[i]) continue;
+    visited[i] = 1;
+    const cluster = [];
+    const queue = [i];
+    while (queue.length > 0) {
+      const current = queue.pop();
+      cluster.push(current);
+      const neighbors = regionQuery(current);
+      for (const neighbor of neighbors) {
+        if (!visited[neighbor]) {
+          visited[neighbor] = 1;
+          queue.push(neighbor);
+        }
+      }
+    }
+    if (cluster.length >= minClusterSize && cluster.length <= maxClusterSize) {
+      clusters.push(cluster);
+    }
+  }
+  return clusters;
+}
 const beforeCcde = (
   /* wgsl*/
   `
@@ -2950,11 +3010,11 @@ const beforeCcde = (
         let g = u32(color.g * 255.0);
         let b = u32(color.b * 255.0);
         let a = u32(color.a * 255.0);
-        return (a << 24u) | (b << 16u) | (g << 8u) | r;
+        return (a << 24u) | (b << 16u) | (g << 8u)  | r;
     }
 
     fn isEmpty(value: u32) -> bool {
-        return value == 0xff000000 || value == 0x0;
+        return value  == 0xff000000 || value == 0x0 ;
     }
 `
 );
@@ -2973,15 +3033,16 @@ const mainCode = (
     // 当前像素
     let center = unPackUint(textureLoad(map, vec2<i32>(x, y), 0));
 
-    // 当前非空，保持原值
-    if (!isEmpty(center)) {
-        result[idx] = center;
+    // 如果当前就是空，直接空
+    if ( isEmpty(center) ) {
+        result[idx] = 0xff000000;
         return;
     }
 
-    // 膨胀：空像素尝试被邻域填充
-    var dilatedValue: u32 = 0xff000000;
+    // 是否被腐蚀
+    var eroded = false;
 
+    // 遍历邻域
     for (var ky = -half; ky <= half; ky = ky + 1) {
         let ny = y + ky;
 
@@ -2998,22 +3059,27 @@ const mainCode = (
 
             let neighbor = unPackUint(textureLoad(map, vec2<i32>(nx, ny), 0));
 
-            // 只要找到非空邻居，直接采用它的值
-            if (!isEmpty(neighbor)) {
-                dilatedValue = neighbor;
+            // 只要有一个是空 → 腐蚀
+            if (isEmpty(neighbor) || neighbor != center) {
+                eroded = true;
                 break;
             }
         }
 
-        if (!isEmpty(dilatedValue)) {
+        if (eroded) {
             break;
         }
     }
 
-    result[idx] = dilatedValue;
+    // 写结果
+    if (eroded) {
+        result[idx] = 0xff000000;
+    } else {
+        result[idx] = center;
+    }
 `
 );
-class DilateMaskComputeMaterial extends ComputeMaterial {
+class ErodeMaskComputeMaterial extends ComputeMaterial {
   constructor(width = 1920, height = 1200, texture, kernelSize = 3) {
     super({
       maxSize: [width, height],
@@ -3023,6 +3089,7 @@ class DilateMaskComputeMaterial extends ComputeMaterial {
         map: { value: texture },
         size: { value: new Vector2(width, height) },
         kernelSize: { value: kernelSize },
+        // 建议从3开始
         result: {
           value: new Uint32Array(width * height),
           write: true
@@ -3031,49 +3098,96 @@ class DilateMaskComputeMaterial extends ComputeMaterial {
     });
   }
 }
-function euclideanClusterExtraction(points, distanceThreshold = 0.2, minClusterSize = 1, maxClusterSize = Infinity) {
-  const pointCount = points.length / 3;
-  const visited = new Uint8Array(pointCount);
-  const clusters = [];
-  const thresholdSq = distanceThreshold * distanceThreshold;
-  function distanceSq(a, b) {
-    const ai = a * 3;
-    const bi = b * 3;
-    const dx = points[ai] - points[bi];
-    const dy = points[ai + 1] - points[bi + 1];
-    const dz = points[ai + 2] - points[bi + 2];
-    return dx * dx + dy * dy + dz * dz;
-  }
-  function regionQuery(index) {
-    const neighbors = [];
-    for (let i = 0; i < pointCount; i++) {
-      if (distanceSq(index, i) <= thresholdSq) {
-        neighbors.push(i);
-      }
-    }
-    return neighbors;
+function ringTriangleGenerator(path, inner = 3, outer = 0) {
+  if (path.length < 3) {
+    return {
+      outerPath: [],
+      innerPath: []
+    };
   }
-  for (let i = 0; i < pointCount; i++) {
-    if (visited[i]) continue;
-    visited[i] = 1;
-    const cluster = [];
-    const queue = [i];
-    while (queue.length > 0) {
-      const current = queue.pop();
-      cluster.push(current);
-      const neighbors = regionQuery(current);
-      for (const neighbor of neighbors) {
-        if (!visited[neighbor]) {
-          visited[neighbor] = 1;
-          queue.push(neighbor);
-        }
+  const len = path.length;
+  let area = 0;
+  for (let i = 0; i < len; i++) {
+    const [x1, y1] = path[i];
+    const [x2, y2] = path[(i + 1) % len];
+    area += x1 * y2 - x2 * y1;
+  }
+  const isCCW = area > 0;
+  const movePath = (distance) => {
+    return path.map((curr, i) => {
+      const prev = path[(i - 1 + len) % len];
+      const next = path[(i + 1) % len];
+      const dx1 = curr[0] - prev[0];
+      const dy1 = curr[1] - prev[1];
+      const l1 = Math.hypot(dx1, dy1) || 1;
+      const dx2 = next[0] - curr[0];
+      const dy2 = next[1] - curr[1];
+      const l2 = Math.hypot(dx2, dy2) || 1;
+      let nx1, ny1;
+      let nx2, ny2;
+      if (isCCW) {
+        nx1 = dy1 / l1;
+        ny1 = -dx1 / l1;
+        nx2 = dy2 / l2;
+        ny2 = -dx2 / l2;
+      } else {
+        nx1 = -dy1 / l1;
+        ny1 = dx1 / l1;
+        nx2 = -dy2 / l2;
+        ny2 = dx2 / l2;
       }
-    }
-    if (cluster.length >= minClusterSize && cluster.length <= maxClusterSize) {
-      clusters.push(cluster);
-    }
+      let nx = nx1 + nx2;
+      let ny = ny1 + ny2;
+      const nl = Math.hypot(nx, ny) || 1;
+      nx /= nl;
+      ny /= nl;
+      return [
+        curr[0] + nx * distance,
+        curr[1] + ny * distance
+      ];
+    });
+  };
+  return {
+    outerPath: movePath(outer),
+    innerPath: movePath(-inner)
+  };
+}
+function ringPathsToMesh(outerPath, innerPath, z = 0) {
+  const len = Math.min(outerPath.length, innerPath.length);
+  if (len < 2) {
+    return [];
+  }
+  const vertices = [];
+  for (let i = 0; i < len; i++) {
+    const next = (i + 1) % len;
+    const o0 = outerPath[i];
+    const o1 = outerPath[next];
+    const i0 = innerPath[i];
+    const i1 = innerPath[next];
+    vertices.push(
+      o0[0],
+      o0[1],
+      z,
+      o1[0],
+      o1[1],
+      z,
+      i0[0],
+      i0[1],
+      z
+    );
+    vertices.push(
+      o1[0],
+      o1[1],
+      z,
+      i1[0],
+      i1[1],
+      z,
+      i0[0],
+      i0[1],
+      z
+    );
   }
-  return clusters;
+  return vertices;
 }
 async function load(base, urls) {
   let points = await loadPCDCustom(base + "/data/rgb_global_map.pcd");
@@ -3082,7 +3196,7 @@ async function load(base, urls) {
   const height = itemsFiles[0].imageSize[1];
   return { points, itemsFiles, width, height };
 }
-function getInfo(itemsFile, cindex) {
+function getInfo(itemsFile, cindex, contractionSize = 10) {
   const width = itemsFile.imageSize[0];
   const height = itemsFile.imageSize[1];
   const T_wi = new THREE.Matrix4();
@@ -3105,9 +3219,9 @@ function getInfo(itemsFile, cindex) {
   for (let i = 0; i < itemsFile.sam3Objects.length; i++) {
     const item = itemsFile.sam3Objects[i];
     const index = cindex * 200 + i + 1;
-    item.coordinates.map((p) => {
-      itemPosition.push(p[0], p[1], index);
-    });
+    const { innerPath, outerPath } = ringTriangleGenerator(item.coordinates, contractionSize, 0);
+    const vertices = ringPathsToMesh(outerPath, innerPath, index);
+    itemPosition.push(...vertices);
   }
   return {
     cameraMat,
@@ -3121,7 +3235,8 @@ async function sopc_(opt) {
   const {
     base,
     urls,
-    dilateMaskSize = 2,
+    maskSize = 3,
+    contractionSize = 10,
     kernelSize = 15,
     groundZ = 0
   } = opt;
@@ -3133,14 +3248,14 @@ async function sopc_(opt) {
     canvasWidth = window.innerWidth ?? canvasWidth;
     canvasHeight = window.innerHeight ?? canvasHeight;
   }
-  const renderer = new Renderer(canvasWidth, canvasHeight, "rgba8unorm"), camera = new PerspectiveCamera(75, canvasWidth / canvasHeight, 1e-3, 100), { points: pointsArray, itemsFiles, width, height } = await load(base, urls), pointCount = pointsArray.length / 3, pcIndexMaterial = new PointCloudsIndexMaterial(width, height), polyAreaIndexMaterial = new PolyAreaIndexMaterial(width, height), dilateMaskComputeMaterial = new DilateMaskComputeMaterial(width, height, polyAreaIndexMaterial.resultTexture, dilateMaskSize), sopcComputeMaterial = new SOPCComputeMaterial(width, height, pointCount, pcIndexMaterial.resultTexture, kernelSize), points = new Object3D(
+  const renderer = new Renderer(canvasWidth, canvasHeight, "rgba8unorm"), camera = new PerspectiveCamera(75, canvasWidth / canvasHeight, 1e-3, 100), { points: pointsArray, itemsFiles, width, height } = await load(base, urls), pointCount = pointsArray.length / 3, pcIndexMaterial = new PointCloudsIndexMaterial(width, height), polyAreaIndexMaterial = new PolyAreaIndexMaterial(width, height), erodeMaskComputeMaterial = new ErodeMaskComputeMaterial(width, height, polyAreaIndexMaterial.resultTexture, maskSize), sopcComputeMaterial = new SOPCComputeMaterial(width, height, pointCount, pcIndexMaterial.resultTexture, kernelSize), points = new Object3D(
     new BufferGeometry().setAttribute("position", new THREE.BufferAttribute(pointsArray, 3)),
     pcIndexMaterial
   ), mesh = new Object3D(
     new BufferGeometry().setAttribute("position", new THREE.BufferAttribute(new Float32Array(), 3)),
     polyAreaIndexMaterial
   );
-  camera.position.set(1, 1, 1);
+  camera.position.set(1, 1, 10);
   pcIndexMaterial.groundZ = groundZ;
   console.log("文件加载耗时：", performance.now() - t);
   t = performance.now();
@@ -3150,7 +3265,7 @@ async function sopc_(opt) {
       console.log("第" + i + "个没有物品");
       continue;
     }
-    const { T_cw, cameraMat, itemPosition } = getInfo(itemsFile, i);
+    const { T_cw, cameraMat, itemPosition } = getInfo(itemsFile, i, contractionSize);
     mesh.geometry.setAttribute("position", new THREE.BufferAttribute(itemPosition, 3));
     pcIndexMaterial.T_cw = T_cw;
     pcIndexMaterial.cameraMat = cameraMat;
@@ -3161,9 +3276,9 @@ async function sopc_(opt) {
     renderer.renderTarget = polyAreaIndexMaterial.resultTexture.view;
     renderer.depthTarget = polyAreaIndexMaterial.resultTexture.depthView;
     renderer.render([mesh], camera);
-    renderer.compute(dilateMaskComputeMaterial);
+    renderer.compute(erodeMaskComputeMaterial);
     sopcComputeMaterial.setStorageBuffer("pcDepth", pcIndexMaterial.getStorageBuffer("depth"));
-    sopcComputeMaterial.setStorageBuffer("polyAreaIndex", dilateMaskComputeMaterial.getStorageBuffer("result"));
+    sopcComputeMaterial.setStorageBuffer("polyAreaIndex", erodeMaskComputeMaterial.getStorageBuffer("result"));
     renderer.compute(sopcComputeMaterial);
   }
   const resultsBuffer = await readGPUBuffer(sopcComputeMaterial.getStorageBuffer("result"), pointCount * 4, Uint32Array);
@@ -3184,13 +3299,19 @@ async function sopc_(opt) {
   }
   const results = Array.from({ length: itemsFiles.length }, () => []);
   const sort = (pointarr) => {
-    let list = euclideanClusterExtraction(pointarr, 0.25).sort((a, b) => b.length - a.length);
+    let list = euclideanClusterExtraction(pointarr, 0.2).sort((a, b) => b.length - a.length);
     if (list.length === 1) return pointarr;
-    return list[0].flatMap((i) => [
+    const maxCount = list[0].length;
+    list = list.filter((item) => item.length > 4 && item.length / maxCount > 0.3);
+    list = list.map((item) => item.flatMap((i) => [
       pointarr[i * 3],
       pointarr[i * 3 + 1],
       pointarr[i * 3 + 2]
-    ]);
+    ]));
+    const centers = list.map((item) => getPointsCenter(item));
+    const maxCenter = centers[0];
+    const distList = centers.map((center) => getPointDistance(center, maxCenter));
+    return list.filter((_, i) => distList[i] < 0.4).flat();
   };
   map.forEach((arrMap, fileIndex) => {
     arrMap.forEach((pointIndexs, itemIndex) => {