3d球体中的对象坐标为2d

Question

我正在制作一个3d指南针，可在three.js中跟踪相机的运动。 这是指南针的图像

在图像中，饼图是相机的FOV，粉红色的小圆圈是场景中的对象。 场景是一个球体，对象都沿着球体的边缘。 给定对象的x，y和z位置，如何获得二维圆的相对位置？ 我尝试获取角度： yAngle = Math.atan(xpos / zpos) ，然后通过执行以下操作获取圆上的x和y位置： x = radius * Math.cos(yAngle), y = radius * Math.sin(yAngle) ，但找不到正确的位置。 我想我可以对three.js投影做些什么？

我真的很感谢您的帮助:)

Answer 1

考虑一下您在空间中有几个物体，包括您的相机。 如果从摄像机的顶部到底部视角查看场景，而忽略了对象是否在摄像机的地平线上方/下方，则可以考虑对象的位置以X / Z表示（请记住，观察方向是沿相机的Y轴）。

获取相机空间中的对象位置

获取对象相对于另一个对象的3D位置相对简单。 在这种情况下，您需要对象相对于相机的位置。

// keep this somewhere accessible to your function scope
var tempObjectLocation = new THREE.Vector3();

// later in your code...

tempObjectLocation.copy(yourObject.position);

// only need to do this if your object isn't already in world coordinates
yourObject.parent.localToWorld(tempObjectLocation); 

// put the vector in camera space
camera.worldToLocal(tempObjectLocation);

// tempObjectLocation now contains the object's position in camera space

在指南针上获得位置

现在您已经有了对象在相机空间中的位置，您可以消除Y分量，或者使用它来检测对象是否在相机水平线上方/下方。 在您的情况下：

tempObjectLocation.y = 0;

现在，您在X / Z中有了一个向量。 假设其值为{x: 15, y: 0, z: 8} 。 假设您的指南针使用半径5来将对象指示器放置在外边缘周围。 只需设置向量的长度即可。

tempObjectLocation.setLength(5);
// tempObjectLocation is now {x: 4.411764705882353, y: 0, z: 2.3529411764705883}

X和Z值现在表示指南针在指示器上的位置，其中{x: 0, y: 0, z: 0}是指南针的中心。 （您可能需要映射X / Z => X / Y，或应用其他变换，具体取决于绘制指南针的方式。）