Threejs之 .obj 模型投影
今天做项目的时候发现threejs中.obj模型投影与geometry的投影有一点不同,写个文章记录一下,防止忘记,也希望能够帮到大家!如果对你的问题产生了帮助,就请点个赞吧 ^_^ ~
原理:
.obj 模型投影的方法是通过遍历 obj.children 中的元素,并给他们设置:castShadow
和receiveShadow
;
核心代码:
for(k in obj.children){ obj.children[k].castShadow = true; obj.children[k].receiveShadow = true; }
创建模型的完整代码:
// 生成汽车模型 function initCar(){ var geometry, material; var loader = new THREE.MTLLoader(); loader.setPath('../3d-models/'); loader.load('car.mtl', function(material){ material.preload(); let objLoader = new THREE.OBJLoader(); objLoader.setMaterials(material); objLoader.load('../3d-models/car.obj', function(obj){ for(k in obj.children){ obj.children[k].castShadow = true; obj.children[k].receiveShadow = true; } // obj.receiveShadow = true; // 这种方式没有效果,只适用于 geometry 模型 // obj.castShadow = true; // 这种方式没有效果,只适用于 geometry 模型 scene.add(obj); }) }) }
geometry投影模型投影的代码:(大家自行与.obj代码对比一下)
function initCube(){ var geometry = new THREE.BoxGeometry(20, 20, 20); var material = new THREE.MeshPhongMaterial({ color: 0xff3300 }); cube = new THREE.Mesh(geometry, material); cube.receiveShadow = true; // 对比.obj cube.castShadow = true; // 对比.obj scene.add(cube) }
仔细分析一下:
其实说白了,当给模型添加阴影的时候,是在Mesh对象上设置castShadow
和 receiveShadow
,而.obj对象是由许多个Mesh组成,都在obj.children中,因此需要遍历obj.children来添加阴影效果。
看一下最终效果:
相关推荐
ALLENJIAO 2020-06-13
stcaolei 2020-03-08
moyebaobei 2020-03-07
stcaolei 2020-03-06
ixshells 2020-03-05
moyebaobei 2020-01-14
liulinsp 2020-01-09
ALLENJIAO 2019-12-20
涓涓溪流 2018-03-02
ALLENJIAO 2019-07-01
moyebaobei 2019-07-01
颜辉 2019-06-28
moyebaobei 2019-06-28
liulinsp 2019-06-27
ALLENJIAO 2019-06-27
ALLENJIAO 2019-06-27
moyebaobei 2015-01-05
stcaolei 2019-06-25
cibeidelangren 2019-06-21