一、npm安装tweemjs

npm i @tweenjs/tween.js@^18

二、引入tweemjs

import * as TWEEN from 'tween.js';

三、使用

//更新相机位置
changeCameraPosition(findIndex) {console.log(camera.position)//解除滑动限制. 如果你在创建模型的时候设置了滑动平移放大缩小等限制在这里需要解除限制，不然达不到你想要的结果。controls.minDistance = 0;controls.maxPolarAngle = Math.PI / 1;controls.enableRotate = falsecontrols.enableZoom = falsecontrols.update();// 相机从当前位置camera.position飞行三维场景中某个世界坐标附近new TWEEN.Tween({// 相机开始坐标x: camera.position.x,y: camera.position.y,z: camera.position.z,// 相机开始指向的目标观察点tx: 0,ty: 0,tz: 0,}).to({// 相机结束坐标x: 0,y: 0,z: 0,// 相机结束指向的目标观察点tx: 0,ty: 0,tz: 0,}, 1000).onUpdate(function (e) {//小程序中使用e，H5中使用this，获取结束的位置信息// 动态改变相机位置camera.position.set(this.x, this.y, this.z);// 模型中心点controls.target.set(this.tx, this.ty, this.tz);controls.update();//内部会执行.lookAt()}).start();
},

注：这里需要在requestAnimationFrame内调用TWEEN.update();不然动画不生效。

// 渲染场景
function animate() {requestAnimationFrame(animate);TWEEN.update();renderer.render(scene, camera);
}
animate();