Three.js：移动过渡和顺序动作-Java 学习之路

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

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

当我将一个场景加载到另一个场景时，我想从一个场景到另一个场景进行某种移动过渡 . 如何通过编程方式实现前后，左右两侧的摄像机移动过渡 .
如何实现“顺序动作”，例如当摄像机向前移动并到达某个地方时，它将加载并显示下一个场景 . 我想，我们可以使用opengl中的“Sequence actions”来实现这一点 .

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 是您的首选 .

示例：http://threejs.org/examples/canvas_interactive_cubes_tween.html

three.js r.58

回复于 2024-05-01T01:06:13+08:00

Three.js：移动过渡和顺序动作

1 回答

相关问题