threejs 高光网格材质MeshPhongMaterial

threejs yekong

threejs 高光网格材质MeshPhongMaterial受光照影响。

MeshPhongMaterial 可以实现MeshLambertMaterial 不能实现的高光反射效果。对于 高光效果,你可以想象一下,你在太阳下面观察一辆车,你会发现在特定角度和位置,你可以看到车表面某个局部区域非常高亮。

高光网格材质与漫反射材质效果对比

漫反射材质效果

const material = new THREE.MeshLambertMaterial({
     color: 0xff0000, //红色
})

漫反射材质效果

高光网格材质效果

const material = new THREE.MeshPhongMaterial({
    color: 0xff0000, //红色
})

高光网格材质效果

镜面反射与漫反射

MeshPhongMaterial可以提供一个镜面反射效果,可以类比你生活中拿一面镜子,放在太阳光下,调整角度,可以把太阳光反射到其它地方,如果反射光对着眼睛,也就是反射光线和视线平行的时候,会非常刺眼。

MeshLambertMaterial对应的Mesh受到光线照射,没有镜面反射的效果,只是一个漫反射,也就是光线向四周反射。

高光亮度属性

通过MeshPhongMaterial 的高光亮度.shininess属性,可以控制高光反射效果。

const material = new THREE.MeshPhongMaterial({
    color: 0xff0000, //红色
    shininess: 100 //高光部分亮度默认是30
})

高光亮度属性100效果

高光亮度属性100

高光颜色属性

通过MeshPhongMaterial 的高光颜色.specular属性,可以控制颜色,默认是0x111111。

const material = new THREE.MeshPhongMaterial({
    color: 0xff0000, //红色
    shininess: 100, //高光部分亮度默认是30
    specular: 0xffffff //高光颜色 默认是0x111111
})

修改为0xffffff白色后的效果
修改为0xffffff白色后的效果

喜欢