背景:
线条是three.js开发的,每条线条的开始位置需要放一个2.5D的图标,所以就需要把三维的坐标转为二维
const myObj = document.getElementById(dom);
const width = myObj.clientWidth;
const height = myObj.clientHeight;
const pos = {x:10,y:10,z:10};
function getPosition(pos = {}) {
let a = new THREE.Vector3(pos.x, pos.y, pos.z);
let vector = a.project(camera);
let halfWidth = width / 2;
let halfHeight = height / 2;
let result = {
x: Math.round(vector.x * halfWidth + halfWidth),
y: Math.round(-vector.y * halfHeight + halfHeight)
};
return result
}