在 3D 空间中跟随并正确朝向相机旋转

Question

我正在尝试让一些 3D 文本跟随移动的立方体。我希望文本始终平放在屏幕上，就像在屏幕空间中移动一样（即使它会在所有轴上移动）。因此，当它移动时，它需要对相机进行旋转校正。我正在尝试通过 meirm 在这里 (Converting 3D position to 2d screen position [r69!]) 调整答案以进行定位及其工作，但我最后的计算 (*1000) 完全是猜测工作（参见下面的函数）。应该是什么？以及如何解决朝向相机的旋转校正问题？

function toScreenPosition(obj, camera)
{
var vector = new THREE.Vector3();

//var widthHalf = 0.5*renderer.context.canvas.width;
//var heightHalf = 0.5*renderer.context.canvas.height;

obj.updateMatrixWorld();
vector.setFromMatrixPosition(obj.matrixWorld);
vector.project(camera);

//vector.x = ( vector.x * widthHalf ) + widthHalf;
//vector.y = - ( vector.y * heightHalf ) + heightHalf;

//how should I be calculating position here?
vector.x = vector.x * 1000;
vector.y = - vector.y * 1000;

console.log(vector.x + 'px, ' + vector.y + 'px');

return { 
    x: vector.x,
    y: vector.y
};

}

我的完整工作示例在这里： http://www.asquare.org/in-progress/webgldemo/rotation-test.html

Answer 1

您只需将 obj 的外观设置为朝向相机：

obj.lookAt( camera.position );