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

推薦：將NSDT場(chǎng)景編輯器加入你的3D工具鏈

其他工具集：NSDT簡(jiǎn)石數字孿生

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

瀏覽器控制打印模型對象mesh，可以展開(kāi)對象，查看對象的幾何體.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);

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

// 訪(fǎng)問(wèn)模型幾何體,并平移幾何體頂點(diǎn)數據
mesh.geometry.translate(0,100,0);

const mesh = new THREE.Mesh(geometry, material);
const mesh2 = new THREE.Mesh(geometry, material);
mesh2.position.x = 100;
// 兩個(gè)mesh共享一個(gè)材質(zhì)，改變一個(gè)mesh的顏色，另一個(gè)mesh2的顏色也會(huì )跟著(zhù)改變
// mesh.material和mesh2.material都指向同一個(gè)material
// 三者等價(jià)：mesh.material、mesh2.material、material
mesh.material.color.set(0xffff00);
// 三者等價(jià)：mesh.geometry、mesh2.geometry、geometry
mesh.geometry.translate(0,100,0);