import TWEEN from '@tweenjs/tween.js'; import * as THREE from 'three'; export default class Util { constructor(camera) { this.camera = camera } // 相机移动动画 CameraTo(targetX, targetY, targetZ, callback) { var requsetId var tween = new TWEEN.Tween(this.camera.position) .to({ x: targetX, y: targetY, z: targetZ }, 500) .start() .onComplete((obj) => { callback() window.cancelAnimationFrame(requsetId) }) animate(); function animate() { requsetId = requestAnimationFrame(animate); TWEEN.update(); // renderer.render(scene, camera); } } // 三维坐标转二维坐标 windowVector(x, y, z, id) { var world_vector = new THREE.Vector3(x, y, z); //三维坐标 var vector = world_vector.project(this.camera); //三维坐标在摄影机上的投影坐标 var halfWidth = window.innerWidth / 2; var halfHeight = window.innerHeight / 2; var wx = Math.round(vector.x * halfWidth + halfWidth); //在屏幕上的坐标 var wy = Math.round(-vector.y * halfHeight + halfHeight); //在屏幕上的坐标 //绑CSS $('#'+id).css('left', wx + 15); $('#'+id).css('top', wy + 15); } }