在Three.js中自动居中和调整GLTF模型的大小-GLB下载网(glbxz.com)gltf文件下载-glb格式下载-模型制作

最近更新：2024年5月29日

在Three.js中自动居中和调整GLTF模型的大小

9。

2024-05-29 小编已售28次关注9次

0.01金币年/月SVIP:0.008金币 该资源永久SVIP免费去升级

收藏 QQ咨询

特别声明：此网站模型都是glb模型下载，gltf文件下载，用于wed展示，有些可能有源文件fbx/obj/blend/3dmax，具体看正文说明，也可联系客服定做模型，网盘过期请用备用下载，提取码都是gltf，如模型加载不兼容，可用网站在线编辑功能，重新导出！GLB下载网(glbxz.com)gltf文件下载-glb格式下载-模型制作https://glbxz.com 充值金币

从glbxz.com下载3D模型并将它们导入Three.js场景后，它们大部分时间都没有居中，而且它们的大小非常大 .

有没有办法使用脚本或软件（在Linux上工作）自动居中和缩放gltf模型，或者在Three.js中即时执行并让相机使用OrbitControls在对象周围移动 .

2 回答

var loader = new THREE.GLTFLoader();
loader.load( 'models/yourmodel.gltf', 
function ( gltf ) {
    gltf.scene.traverse( function ( child ) {
        if ( child.isMesh ) {
            child.geometry.center(); // center here
        }
    });
    gltf.scene.scale.set(10,10,10) // scale here
    scene.add( gltf.scene );
}, (xhr) => xhr, ( err ) => console.error( e ));

要移动对象，请使用controls.target（）https://threejs.org/docs/#examples/controls/OrbitControls.target

是的 . 此代码获取一个节点并找到其大小和中心点，然后重新调整它以使最大范围为1并且其中心位于0,0,0，并且位于y轴上的地面之上 .

var mroot = yourScene;
    var bbox = new THREE.Box3().setFromObject(mroot);
    var cent = bbox.getCenter(new THREE.Vector3());
    var size = bbox.getSize(new THREE.Vector3());

    //Rescale the object to normalized space
    var maxAxis = Math.max(size.x, size.y, size.z);
    mroot.scale.multiplyScalar(1.0 / maxAxis);
    bbox.setFromObject(mroot);
    bbox.getCenter(cent);
    bbox.getSize(size);
    //Reposition to 0,halfY,0
    mroot.position.copy(cent).multiplyScalar(-1);
    mroot.position.y-= (size.y * 0.5);

常见问题FAQ