Three.js教程：模型材质和几何体属性

推荐：将NSDT场景编辑器加入你的3D工具链

https://ted.sinoccdc.cn/

其他工具集：NSDT简石数字孪生
模型材质和几何体属性
本节课给大家介绍模型对象的几何体.geometry和材质属性.material。

浏览器控制台查看对象和属性

浏览器控制打印模型对象mesh，可以展开对象，查看对象的几何体.geometry和材质属性.material。

const mesh = new THREE.Mesh(geometry, material);
console.log('mesh',mesh);
浏览器控制台打印模型的几何体属性.geometry和材质属性.material。

console.log('mesh.geometry',mesh.geometry);
console.log('mesh.material',mesh.material);

访问改变模型材质属性

// 访问模型材质,并设置材质的颜色属性
mesh.material.color.set(0xffff00);

访问改变模型几何体属性

// 访问模型几何体,并平移几何体顶点数据
mesh.geometry.translate(0,100,0);

材质或几何体共享

const mesh = new THREE.Mesh(geometry, material);
const mesh2 = new THREE.Mesh(geometry, material);
mesh2.position.x = 100;
// 两个mesh共享一个材质，改变一个mesh的颜色，另一个mesh2的颜色也会跟着改变
// mesh.material和mesh2.material都指向同一个material
// 三者等价：mesh.material、mesh2.material、material
mesh.material.color.set(0xffff00);
// 三者等价：mesh.geometry、mesh2.geometry、geometry
mesh.geometry.translate(0,100,0);