Three.js 如何设置Collada模型的动画&x27;3.js中的儿童?

Three.js 如何设置Collada模型的动画&x27;3.js中的儿童?,three.js,Three.js,我正试图找到一种方法,让孩子们在加拿大的Collada模型中动画化。该模型包含7个臂段,其角度需要通过每次读取7个电子表格列中每一行的旋转角度数据来设置。每行包含7列数据,代表一小时或更长时间内每秒的角度 我希望有人能为我提供一个解决方案,让我开始学习——也许像我在下面的animate()函数中尝试的猜测一样 if ( ! Detector.webgl ) Detector.addGetWebGLMessage(); var container, stats, clock;

我正试图找到一种方法,让孩子们在加拿大的Collada模型中动画化。该模型包含7个臂段,其角度需要通过每次读取7个电子表格列中每一行的旋转角度数据来设置。每行包含7列数据,代表一小时或更长时间内每秒的角度

我希望有人能为我提供一个解决方案,让我开始学习——也许像我在下面的animate()函数中尝试的猜测一样

if ( ! Detector.webgl ) Detector.addGetWebGLMessage();

        var container, stats, clock;
        var camera, scene, renderer, canadarm2;

        init();
        animate();

        function init() {

            container = document.getElementById( 'container' );

            camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 0.1, 2000 );
            camera.position.set( 8, 10, 80 );
            camera.lookAt( new THREE.Vector3( 0, 3, 0 ) );

            scene = new THREE.Scene();

            clock = new THREE.Clock();

            // loading manager

            var loadingManager = new THREE.LoadingManager( function() {

                scene.add( canadarm2 );

            } );

            // collada

            var loader = new THREE.ColladaLoader( loadingManager );
            //loader.load( 'examples/models/collada/elf/elf.dae', function ( collada ) {
            loader.load( 'canadarm2.dae', function ( collada ) {

                canadarm2 = collada.scene;

            } );

            //

            var ambientLight = new THREE.AmbientLight( 0xcccccc, 0.4 );
            scene.add( ambientLight );

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

            //

            renderer = new THREE.WebGLRenderer();
            renderer.setPixelRatio( window.devicePixelRatio );
            renderer.setSize( window.innerWidth, window.innerHeight );
            container.appendChild( renderer.domElement );

            //

            stats = new Stats();
            container.appendChild( stats.dom );

            //

            window.addEventListener( 'resize', onWindowResize, false );

        }

        function onWindowResize() {

            camera.aspect = window.innerWidth / window.innerHeight;
            camera.updateProjectionMatrix();

            renderer.setSize( window.innerWidth, window.innerHeight );

        }

        function animate() {

            /*
            //#######################################
            // doesn't work
            var armEP = canadarm2.getChildByName("EP", true);// EP is one of 7 arms
            armEP.position.x += 0.01;
            armEP.rotation.y += 45;
            //#######################################
            */

            render();
            stats.update();

        }

        function render() {

            var delta = clock.getDelta();

            if ( canadarm2 !== undefined ) {

                canadarm2.rotation.z += delta * 0.5;

            }

            renderer.render( scene, camera );

        }

这似乎是可行的,虽然它似乎是一个非常迂回的方式来定位武器

scene.traverse(function (child) {
    switch(child.name) {
        case "SR":
            child.rotation.x += 0.01;
            break;
        case "SP":
            child.rotation.y += 0.01;
            break;
        case "SY":
            child.rotation.y += 0.01;
            break;
        case "EP":
            child.rotation.y += 0.01;
            break;
        case "WP":
            child.rotation.x += 0.01;
            break;
        case "WY":
            child.rotation.y += 0.01;
            break;
        case "WR":
            child.rotation.x += 0.01;
            break;
    }
});