【问题标题】:ThreeJS collada file not centredThreeJS collada 文件未居中
【发布时间】:2018-07-21 10:51:37
【问题描述】:

我是 ThreeJS 的新手,我正在尝试将 collada 文件加载到查看器中。我首先复制了 Elf colladaLoader 演示的代码。

https://threejs.org/examples/#webgl_loader_collada

我在一个 800 像素的方形模态窗口中可以正常工作,而且看起来不错。问题是当我加载任何其他 .dae 文件时它没有居中。

演示显然是使用所有正确的设置创建的,可以将对象和相机放在正确的位置,但我不知道要加载哪些文件。

有没有什么方法可以让相机直接看向对象,使其居中并将其定位到足够远的位置,以便对象填满容器?

【问题讨论】:

    标签: javascript three.js collada


    【解决方案1】:

    camera.lookAt( object.position ) 会做大部分你想做的事。将相机定位在适当的距离有点主观。我通常会这样做:

    object.updateMatrixWorld();
    const box = new THREE.Box3().setFromObject(object);
    const size = box.getSize().length();
    const center = box.getCenter();
    
    object.position.x += (object.position.x - center.x);
    object.position.y += (object.position.y - center.y);
    object.position.z += (object.position.z - center.z);
    camera.position.copy(center);
    camera.position.x += size / 2.0;
    camera.position.y += size / 5.0;
    camera.position.z += size / 2.0;
    camera.near = size / 100;
    camera.far = size * 100;
    camera.updateProjectionMatrix();
    camera.lookAt(center);
    

    参见THREE.Object3D docs,three.js r89。

    【讨论】:

    • 谢谢,这似乎基本上可以工作,尽管大多数模型似乎偏离了中心。我猜那是因为对象本身的中心与对象可见部分的中心不匹配?
    猜你喜欢
    • 2012-10-06
    • 1970-01-01
    • 2016-09-09
    • 2015-10-09
    • 1970-01-01
    • 2014-01-03
    • 2017-07-15
    • 1970-01-01
    相关资源
    最近更新 更多