threejs - 边缘几何体和线框几何体

线框几何体

获取到几何体

根据名称获取到几何体

gltfLoader.load("./model/Duck.glb", (gltf) => {
  scene.add(gltf.scene);
  // 获取到几何体
  let duck = gltf.scene.getObjectByName("LOD3spShape")
});

创建边缘几何体

let geometry = duck.geometry
// 以几何体边缘来展示
let edgesGeometry = new THREE.EdgesGeometry(geometry)

生成线段

// 生成线段
const line = new THREE.LineSegments(edgesGeometry, new THREE.LineBasicMaterial({
color: 0xff0000
}))

更新几何体世界转换矩阵

// 更新几何体世界转换矩阵
duck.updateWorldMatrix(true, true)
line.matrix.copy(duck.matrixWorld)

同步

line.matrix.decompose(line.position, line.quaternion, line.scale)

场景中所有几何体的线框模式

traverse()可以获取到场景中所有的几何体