Three.js使用SceneUtils为模型添加多种材质

JavaScript034

Three.js使用SceneUtils为模型添加多种材质,第1张

当我们想要为模型添加多种材质的时候可以通过使用SceneUtils来实现。

该正方体的材质使用了MeshBasicMaterial和MeshLambertMaterial。

通过SceneUtils中createMultiMaterialObject属性来为模型使用多个材质。createMultiMaterialObject的第一个参数是模型对象，第二个参数是材质数组。

map为默认材质色，添加normalMap法线贴图产生凹凸视觉， 配合roughness数值产生高光。

材质代码：

let map_d=new THREE.TextureLoader().load("常规贴图.jpg")

let map_n=new THREE.TextureLoader().load("法线贴图.jpg")

let material=new THREE.MeshStandardMaterial({

map:map_d,

normalMap:map_n,

roughness:0.1

})

let geometry = new THREE.CircleBufferGeometry( 5, 32 )

let circle = new THREE.Mesh( geometry, material )

scene.add( circle )