I modified the materials and outlines of the model, I wanted it to display more like a wireframe.
After it renders, as soon as I click on the screen, I don’t know exactly what it’s computing, but the pointerdown event takes a super long time to execute straight away. I haven’t added any loops inside my own code, and I’m not sure what I should do to fix this!
useEffect(() => {
const model = modelRef.current;
if (model) {
model.traverse((child) => {
if (child instanceof Mesh) {
// 保存原始材质
if (!child.userData.originalMaterial) {
child.userData.originalMaterial = child.material;
}
// 设置子组件的材质
if (isWireframe) {
// 创建线框材质和轮廓线对象
const wireframeMaterial = new LineBasicMaterial({ color: 0x000000 });
const edges = new EdgesGeometry(child.geometry);
const outline = new LineSegments(edges, wireframeMaterial);
// 将轮廓线对象添加到子组件中
child.add(outline);
// 设置实心的白色材质
child.material = new MeshBasicMaterial({ color: 0xffffff });
} else {
//TODO
}
}
});
}
}, [isWireframe]);