Question

我是Three.js和3D编程的新手，但我试图让this three.js example的马从固定的摄像头移过屏幕。

加载＆＃39;的代码马在这里：

var loader = new THREE.JSONLoader();
loader.load( "models/animated/horse.js", function( geometry ) {

    mesh = new THREE.Mesh( geometry, new THREE.MeshLambertMaterial( {
            vertexColors: THREE.FaceColors,
            morphTargets: true
            } ) );
            mesh.scale.set( 1.5, 1.5, 1.5 );
            scene.add( mesh );

            mixer = new THREE.AnimationMixer( mesh );

            var clip = THREE.AnimationClip.CreateFromMorphTargetSequence( 'gallop', geometry.morphTargets, 30 );
                mixer.addAction( new THREE.AnimationAction( clip ).warpToDuration( 1 ) );

            } );

在我的渲染功能中，我无法像使用相机一样增加对象的x和z值：

var radius = 600;
var theta = 0;
var prevTime = Date.now();

function render() {

theta += 0.1;
camera.position.x = radius * Math.sin( THREE.Math.degToRad( 90 ) );
camera.position.z = radius * Math.cos( THREE.Math.degToRad( 90 ) );

mesh.position.x = theta;
mesh.position.z = theta;
}

我得到Uncaught TypeError: Cannot set property 'x' of undefined，即使我在Javascript控制台中输入数字时mesh.position.x会返回一个数字。我该如何翻译这个对象？

Answer 1

loader.load()是一种异步方法。这就是你指定回调函数的原因。在引用模型之前，您需要确保模型已加载。

一种解决方案是在渲染循环中使用此模式：

if ( mesh ) { mesh.position.x = theta; }

另一种解决方案是在回调函数中启动animate()。

three.js r.73

将自定义几何体转换为三个，js

1 个答案: