Three.js:移动转换和序列操作

Question

我正在使用WebGL库开发一个Three.JS应用程序。

我试图在场景中将Blender 3d模型加载到我的Three.js应用程序中，并尝试在一个场景和另一个场景之间导航。我能够成功地将搅拌机3d模型js文件加载到场景中，并在基于Three.js的项目中正确地显示了该模型。我现在有以下要求，但无法完成。

1. 当我将一个场景加载到另一个场景时，我想从一个场景到另一个场景进行某种移动转换。如何通过编程实现摄像机像前、后、右、左的移动过渡。
2. 如何实现“序列动作”，比如当摄像机移动到一个地方时，它会加载并显示下一个场景。我认为，我们可以使用opengl中的“序列操作”来实现这一点。

Answer 1

@zz85创建了一个优秀的Director类，它支持如下所示的链接模式：

director = new THREE.Director();

director
.addAction( 0, function() {
    camera.position.set( 750, 850, 750 );
})
.addAction( 10, function() {
    // do something
    doSomething();
})
.addAction( 10, function() {
    // top view
    camera.position.set( 0, 1000, 0 );
})
// cross the terrain
.addTween( 18, 4, camera.position, {}, { x:300 , y: 80, z: -2000 }, 'cubicInOut' )
.addTween( 18, 4, camera, { lens: 35 }, { lens: 100 }, 'cubicInOut', function( k ) {
    camera.setLens( camera.lens );
})
.addTween( 18, 4, lookAt, {}, { x:300 , y: 80, z: 2000 }, 'linear' )

})
.addAction( 80, function() {
    stop();
});

演示：http://jabtunes.com/labs/boidsnbuildings/

博文：http://www.lab4games.net/zz85/blog/2012/11/19/making-of-boids-and-buildings/

这个演示使用three.js。r.54dev，但我预计它将适用于当前版本的three.js r.58。

另一种选择是使用Tween.js，但根据您的需求，我希望Director将是您的首选。

示例：tween.html

three.js r.58号