<script src="Tween.js"></script>
/ 立方体网格模型
var mesh = new THREE.Mesh(...);
...
// twwen代码设置
var rota = ({
  x: 0
});
var ro1 = new TWEEN.Tween(rota);
ro1.to({
  x: 1
}, 4000);
ro1.easing(TWEEN.Easing.Sinusoidal.InOut);
ro1.onUpdate(function() {
  mesh.rotation.y = this.x * 2 * Math.PI;
  console.log('onUpdate里面的函数执行一次')
});

var ro2 = new TWEEN.Tween(rota);
ro2.to({
  x: 0
}, 4000);
ro2.easing(TWEEN.Easing.Sinusoidal.InOut);
ro2.onUpdate(function() {
  mesh.rotation.y = this.x * 2 * Math.PI;
});

ro1.chain(ro2);
ro2.chain(ro1);

ro1.start();

// 渲染函数中执行TWEEN的update()方法
function render() {
  TWEEN.update();
  renderer.render(scene, camera);
  // mesh.rotateY(0.01);//每次绕y轴旋转0.01弧度
  requestAnimationFrame(render);
}
render();

来源:http://www.yanhuangxueyuan.com/doc/Three.js/twwen.html

作者 铁血 汉子 2023年12月14日
2024/12/21/02:34:51pm 2023/12/14/15:24:36
0 347