Question

我尝试使用objloader，mtlloader和orbitcontrols加载3D模型。但是对于每种模型，我都必须每周调整摄像机的位置以适合对象，是否有一种方法可以自动放置摄像机和对象，以便我可以使用一个代码即可动态加载各种模型？

这是我尝试过的。

new MTLLoader( manager )
                    .setPath( './' )
                    .load( 'model.mtl', function ( materials ) {

                        materials.preload();

                        new OBJLoader( manager )
                                .setMaterials( materials )
                                .setPath( './' )
                                .load( 'model.obj', function ( object ) {
                                    object.position.y -= 200;
                                    object.position.x -= 100;
                                    object.position.z += 300;
                                    scene.add( object );
                                }, onProgress, onError );

                    } );

该对象的位置设置为硬编码，在其他模型上将不起作用吗？有办法解决这个问题吗？

Answer 1

有没有一种方法可以自动放置相机和对象，以便我可以使用一个代码来动态加载各种模型？

是的，您基本上可以应用专业模型查看器软件使用的方法。一个流行的示例来自以下基于three.js的{{3}}。它是开源的，相关代码部分为：

const box = new THREE.Box3().setFromObject(object);
const size = box.getSize(new THREE.Vector3()).length();
const center = box.getCenter(new THREE.Vector3());

controls.reset();

object.position.x += (object.position.x - center.x);
object.position.y += (object.position.y - center.y);
object.position.z += (object.position.z - center.z);
controls.maxDistance = size * 10;
camera.near = size / 100;
camera.far = size * 100;
camera.updateProjectionMatrix();

camera.position.copy(center);
camera.position.x += size / 2.0;
camera.position.y += size / 5.0;
camera.position.z += size / 2.0;
camera.lookAt(center);

controls.saveState();

该想法是从加载的3D对象计算AABB，然后得出相应的中心和大小。这些数据可用于将3D对象定位在原点以及调整相机和控件参数。查看项目的glTF-Viewer，以获取完整的示例。

如何在Three.js中加载各种obj 3D模型？

1 个答案: