Three.js教程：模型材質(zhì)和幾何體屬性

推薦：將NSDT場景編輯器加入你的3D工具鏈

其他工具集：NSDT簡石數(shù)字孿生

本節(jié)課給大家介紹模型對象的幾何體.geometry和材質(zhì)屬性.material。

瀏覽器控制打印模型對象mesh，可以展開對象，查看對象的幾何體.geometry和材質(zhì)屬性.material。

const mesh = new THREE.Mesh(geometry, material);
console.log('mesh',mesh);

瀏覽器控制臺打印模型的幾何體屬性.geometry和材質(zhì)屬性.material。

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

// 訪問模型材質(zhì),并設(shè)置材質(zhì)的顏色屬性
mesh.material.color.set(0xffff00);

// 訪問模型幾何體,并平移幾何體頂點數(shù)據(jù)
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共享一個材質(zhì)，改變一個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);