使用投影在Three.js中将世界坐标转换为屏幕坐标
在Three.js中有几个优秀的堆栈问题（ 1，2 ）是关于如何将浏览器中的（x，y）鼠标坐标转换为Three.jscanvas空间中的（x，y，z）坐标。 他们大多遵循这种模式：
var elem = renderer.domElement, boundingRect = elem.getBoundingClientRect(), x = (event.clientX - boundingRect.left) * (elem.width / boundingRect.width), y = (event.clientY - boundingRect.top) * (elem.height / boundingRect.height); var vector = new THREE.Vector3( ( x / WIDTH ) * 2 - 1, - ( y / HEIGHT ) * 2 + 1, 0.5 ); projector.unprojectVector( vector, camera ); var ray = new THREE.Ray( camera.position, vector.subSelf( camera.position ).normalize() ); var intersects = ray.intersectObjects( scene.children ); 我一直试图做到相反 – 而不是从“屏幕到世界”的空间，从“世界到屏幕”的空间。 如果我知道Three.js中对象的位置，我如何确定它在屏幕上的位置？
似乎没有任何已发布的解决scheme来解决这个问题。 关于这个问题的另一个问题刚刚出现在Stack上 ，但作者声称用一个不适合我的函数解决了这个问题。 他们的解决scheme不使用投影射线，而且我确信从2D到3D使用unprojectVector（），3D到2D解决scheme将需要projectVector（）。
Github上也有这个问题 。
任何帮助表示赞赏。
试试这个：
var width = 640, height = 480; var widthHalf = width / 2, heightHalf = height / 2; var vector = new THREE.Vector3(); var projector = new THREE.Projector(); projector.projectVector( vector.setFromMatrixPosition( object.matrixWorld ), camera ); vector.x = ( vector.x * widthHalf ) + widthHalf; vector.y = - ( vector.y * heightHalf ) + heightHalf;
对于现代Three.js（r75），vector可以投影到屏幕上：
var width = window.innerWidth, height = window.innerHeight; var widthHalf = width / 2, heightHalf = height / 2; var pos = object.position.clone(); pos.project(camera); pos.x = ( pos.x * widthHalf ) + widthHalf; pos.y = - ( pos.y * heightHalf ) + heightHalf;
对于每个人都deprecated或warnings日志，接受的答案是旧的Three.js版本。 现在更容易：
let pos = new THREE.Vector3(); pos = pos.setFromMatrixPosition(object.matrixWorld); pos.project(camera); let widthHalf = canvasWidth / 2; let heightHalf = canvasHeight / 2; pos.x = (pos.x * widthHalf) + widthHalf; pos.y = - (pos.y * heightHalf) + heightHalf; pos.z = 0; console.log(pos);
您不能将（x，y）坐标转换为（x，y，z）坐标，因为您丢失了信息。 你所引用的是如何find场景中与（x，y）产生的光线相交的所有物体上的所有点。
您所要求的从“世界到屏幕”的过程就是投影的全部内容，相当于渲染单个点（x，y，z）。 你所做的是将投影matrix应用到你的点（x，y，z）。 这大概是在http://mrdoob.github.com/three.js/docs/49/#Projector的;Projector.projectVector(vector, camera)函数，但是由于它输出一个3dvector，所以我只能假定其中一个维度为0，您可以忽略它。
