繁体   English   中英

旋转.obj文件OBJMTLLoader three.js

[英]Rotating .obj file OBJMTLLoader three.js

我将OBJMTLLoader类用于一个obj文件,并且通过使用object.rotation.y -= 0.5围绕对象上的固定点进行了很好的旋转。 使用相同的代码(减去更改摄像机的位置),我用另一个替换了.obj文件,并且旋转现在以圆周运动进行,就像围绕摄像机而不是固定在原地。 任何想法为什么当我使用相同的代码?

谢谢

编辑:

var OBJLoaded;    

function init()
{
    container = document.getElementById('player');
    camera = new THREE.PerspectiveCamera(45, window.innerWidth/window.innerHeight, 1,  2000);
    camera.position.x = 110;
    camera.position.z = -160;
    camera.position.y = 15;

    // camera.position.z = 40;
    // camera.position.y = 2;

    //scene
    scene = new THREE.Scene();

    var ambient = new THREE.AmbientLight( 0x444444 );
    scene.add( ambient );

    var directionalLight = new THREE.DirectionalLight( 0xffffff );
    directionalLight.position.set( 100, 90, 200 );
    scene.add( directionalLight );

    //model
    var loader = new THREE.OBJMTLLoader();
    //loader.load('./assets/Stereo_LowPoly.obj', './assets/Stereo_LowPoly.mtl',    function(object)
    loader.load('./assets/studio_beats.obj', './assets/studio_beats.mtl', function(object)
    { 
        OBJLoaded = object;
        console.log(object);
        scene.add( object );
    });

    renderer = new THREE.WebGLRenderer({alpha: true});
    renderer.setClearColor(0x000000, 0);
    renderer.setSize($('#player').width(), $('#player').height());
    container.appendChild(renderer.domElement);

    scene.add(camera);
}

function animateBoombox()
{
    requestAnimationFrame(animateBoombox);
    render();
}   

function render()
{
    var rotSpeed = 0.004;
    if (OBJLoaded) 
    { 
        OBJLoaded.rotation.y -= rotSpeed;
    }
    renderer.render(scene, camera);
}

注释的零件(相机和对象加载)适用于先前加载的对象。 效果很好,但未注释的部分效果不同。

您加载的对象有一个来自模型创建器软件的枢轴点...您需要先更改对象的枢轴点,然后再用three.js加载它。

如果不能,则应像我在加载程序回调中一样:

            var loader = new THREE.OBJMTLLoader();
            loader.load('your_file.obj', 'your_file.mtl', function (object) {
                object.traverse(function (child) {
                    child.centroid = new THREE.Vector3();
                    for (var i = 0, l = child.geometry.vertices.length; i < l; i++) {
                        child.centroid.add(child.geometry.vertices[i].clone());
                    }
                    child.centroid.divideScalar(child.geometry.vertices.length);
                    var offset = child.centroid.clone();
                    child.geometry.applyMatrix(new THREE.Matrix4().makeTranslation(-offset.x, -offset.y, -offset.z));
                    child.position.copy(child.centroid);
                    child.geometry.computeBoundingBox();
                });
            });

然后旋转你的物体...

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM