当前位置:   article > 正文

在Three.js中重新设置3D模型的中心点_three.js 修改导入的模型中心

three.js 修改导入的模型中心

最近有个新想法,要在网页上展示3D重建的模型(obj + mtl 格式),并且可以拖拽缩放。

实施过程中发现模型的中心点是偏离到模型外部的,经过查阅Three.js资料发现两个关键函数

 
 
  1. geometry.computeBoundingBox();
  2. geometry.center()
因此把导入obj + mtl的函数修改如下

  1. var mtlLoader = new THREE.MTLLoader();
  2. mtlLoader.setPath('obj/shigandang/');
  3. mtlLoader.load('shigandang.mtl', function (materials) {
  4. materials.preload();
  5. var objLoader = new THREE.OBJLoader();
  6. objLoader.setMaterials(materials);
  7. //objLoader.setPath('obj/male02/');
  8. objLoader.setPath('obj/shigandang/');
  9. //objLoader.load('male02.obj', function (object) {
  10. objLoader.load('shigandang.obj', function (object) {
  11. // object.scale.set(0.1, 0.1, 0.1);
  12. console.log(object);
  13. object.children[0].geometry.computeBoundingBox();
  14. object.rotation.x = THREE.Math.degToRad( 90 );
  15. console.log(- ( object.children[0].geometry.boundingBox.max.x + object.children[0].geometry.boundingBox.min.x ) / 2);
  16. console.log(- ( object.children[0].geometry.boundingBox.max.y + object.children[0].geometry.boundingBox.min.y ) / 2);
  17. console.log(- ( object.children[0].geometry.boundingBox.max.z + object.children[0].geometry.boundingBox.min.z ) / 2);
  18. console.log( object.children[0].geometry.center() );
  1. object.children[0].geometry.center()
  2. helper = new THREE.BoundingBoxHelper(object, 0xff0000);
  3. helper.update();
  4. scene.add(helper);
  5. scene.add(object);
  6. }, onProgress, onError);
  7. });


声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/IT小白/article/detail/99742
推荐阅读
相关标签
  

闽ICP备14008679号