util.js 1.3 KB

123456789101112131415161718192021222324252627282930313233343536373839
  1. import TWEEN from '@tweenjs/tween.js';
  2. import * as THREE from 'three';
  3. export default class Util {
  4. constructor(camera) {
  5. this.camera = camera
  6. }
  7. // 相机移动动画
  8. CameraTo(targetX, targetY, targetZ, callback) {
  9. var requsetId
  10. var tween = new TWEEN.Tween(this.camera.position)
  11. .to({ x: targetX, y: targetY, z: targetZ }, 500)
  12. .start()
  13. .onComplete((obj) => {
  14. callback()
  15. window.cancelAnimationFrame(requsetId)
  16. })
  17. animate();
  18. function animate() {
  19. requsetId = requestAnimationFrame(animate);
  20. TWEEN.update();
  21. // renderer.render(scene, camera);
  22. }
  23. }
  24. // 三维坐标转二维坐标
  25. windowVector(x, y, z, id) {
  26. var world_vector = new THREE.Vector3(x, y, z); //三维坐标
  27. var vector = world_vector.project(this.camera); //三维坐标在摄影机上的投影坐标
  28. var halfWidth = window.innerWidth / 2;
  29. var halfHeight = window.innerHeight / 2;
  30. var wx = Math.round(vector.x * halfWidth + halfWidth); //在屏幕上的坐标
  31. var wy = Math.round(-vector.y * halfHeight + halfHeight); //在屏幕上的坐标 //绑CSS
  32. $('#'+id).css('left', wx + 15);
  33. $('#'+id).css('top', wy + 15);
  34. }
  35. }