three.js实战笔记

95 阅读1分钟

1.如何获得object3d对象

通过getObjectByName('')或者通过getObjectById()获取

2.模型加载进度条

loader.load("../工厂.glb", function (gltf) {
    model.add(gltf.scene);
    // 加载完成,隐藏进度条
    // document.getElementById("container").style.visibility ='hidden';
    document.getElementById("container").style.display = 'none';
}, function (xhr) { 
    const percent = xhr.loaded / xhr.total;
    console.log('加载进度' + percent);
})

修改模型的材质

// 要么先克隆一份
const mesh2 = mesh.clone();
// 克隆几何体和材质,重新设置mesh2的材质和几何体属性
mesh2.geometry = mesh.geometry.clone();
mesh2.material = mesh.material.clone();
// 改变mesh2颜色,不会改变mesh的颜色
mesh2.material.color.set(0xff0000);

// 要么重新生成一个新的材质
![image.png](https://p6-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/07776697fb1741cebef863cb45e316c0~tplv-k3u1fbpfcp-jj-mark:0:0:0:0:q75.image#?w=1036&h=132&s=213417&e=png&b=222120)
mesh2.children.forEach((v) => {
if (v.isMesh) {
  // mesh2.material = mesh.material.clone();
  v.material = new THREE.MeshStandardMaterial({ color: 0xff0000 });
}
});