three.js设置模型边界线

three.js设置模型边界线

图例

步骤

1. 拿到模型（如果是外部模型需要遍历），设置透明度
2. 根据模型的几何体创建EdgesGeometry几何体
3. 创建线条材质
4. 创建LineSegments线模型
5. 模型加入线模型

代码

const m = model.scene.getObjectByName("仓库");
  // 模型边界线
  m.traverse(function (obj) {
    if (obj.isMesh) {
      obj.material.transparent = true;
      obj.material.opacity = 0.3;
      const edges = new THREE.EdgesGeometry(obj.geometry);
      const edgesMaterial = new THREE.LineBasicMaterial({
        color: 0x00ffff,
      });
      const line = new THREE.LineSegments(edges, edgesMaterial);
      obj.add(line);
    }
  });