Question

我有两个模型，通过搅拌器以three.js框架使用的JS格式导出。身体和外套。他们两个都有不同位置的骨头。

我需要的是将衣服贴在身上。但是，当我设置外套的身体位置时，外套会因为不旋转而变形。我已经在论坛上验证了文档和其他问题，我发现了一些关于quaternon的内容，但我不明白如何使用它。参数值对我来说很奇怪。

我想知道是否有人知道如何解决这种情况？我不知道它是否是Blender上的任何属性，或者我必须在我的代码中执行某些操作。

这是我的代码

var container, stats;

var camera, scene, renderer;

var finish = 0;
var parents = 0;

var sprites = {};
sprites.obj = [];

init();
animate();

function init() {

    container = document.createElement( 'div' );
    document.getElementById('game-screen').appendChild( container );

    camera = new THREE.PerspectiveCamera( 45, 800/600, 1, 2000 );
    camera.position.z = 20;

    scene = new THREE.Scene();

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

    var directionalLight = new THREE.DirectionalLight( 0xaaaaaa );
    directionalLight.position.set( 0, 0, 1 ).normalize();
    scene.add( directionalLight );

    renderer = new THREE.WebGLRenderer();
    renderer.setSize(800, 600);
    renderer.setClearColorHex(0x333F47, 1); //cor de fundo + alpha

    container.appendChild( renderer.domElement );

    stats = new Stats();
    stats.domElement.style.position = 'absolute';
    stats.domElement.style.top = '0px';
    stats.domElement.style.zIndex = 100;

    container.appendChild(stats.domElement);


    // Add OrbitControls so that we can pan around with the mouse.
    controls = new THREE.OrbitControls(camera, renderer.domElement);

    var loader = new THREE.JSONLoader();
    loader.load( "models/personagem.js", function(geometry, materials){
        var material = new THREE.MeshLambertMaterial({color: 0x55B663, skinning: true});
        var mesh = new THREE.SkinnedMesh(geometry, material);
        sprites.obj[0] = mesh;
        scene.add(mesh);

        finish++;
    });

    loader.load( "models/paleto.js", function(geometry, materials){
        var material = new THREE.MeshLambertMaterial({color: 0xFF00FF, skinning: true});
        var mesh = new THREE.SkinnedMesh(geometry, material);
        sprites.obj[1] = mesh;
        scene.add(mesh);

        finish++;
    });

    camera.lookAt( scene.position );
}


function animate() {
    requestAnimationFrame( animate );

    if(finish == 2 && sprites.obj[0] && sprites.obj[1]) {
        finish = 0;

        scene.updateMatrixWorld();

        for(i in sprites.obj[0].bones) {
            for(j in sprites.obj[1].bones) {
                if(sprites.obj[0].bones[i].name != sprites.obj[1].bones[j].name)
                    continue;

                parents = 0;

                sprites.obj[1].bones[j].position.x = sprites.obj[0].bones[i].position.x;
                sprites.obj[1].bones[j].position.y = sprites.obj[0].bones[i].position.y;
                sprites.obj[1].bones[j].position.z = sprites.obj[0].bones[i].position.z;
            }

        }

        sprites.obj[1].geometry.verticesNeedUpdate = true;
        sprites.obj[1].geometry.normalsNeedUpdate = true;
    }

    render();
    controls.update();
    stats.update();
}

function render() {

    renderer.render( scene, camera );
}

这是我的模特

https://www.dropbox.com/s/ho1inpfab1s36xq/personagem.js https://www.dropbox.com/s/uuk0uprnqw61tac/paleto.js

此致路易斯

如何在Three.js中放入两块骨头？

0 个答案: