dwweb-h5/2018专题/18073D模型展示专题-H5/js/util.js

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 + 5);
        $('#'+id).css('top', wy + 5);
    }
}