3d 球体中的对象坐标到 2d答案

【问题标题】：Objects in a 3d sphere coordinates to 2d3d 球体中的对象坐标到 2d
【发布时间】：2017-05-26 00:08:00
【问题描述】：

我正在制作一个 3d 指南针，用于在 three.js 中跟踪相机的运动。 Here's an image of the compass

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

我真的很感激一些帮助:)

【问题讨论】：

由于您的指南针是 2D 的，它是否被视为您相机方向的自上而下表示？假设是，你的相机的运动是平面的，还是你需要指出一个物体是否在相机的地平线之上/之下？
不——因为它是 2d，我将忽略相机水平线的上方/下方 :)

标签： javascript 3d three.js

【解决方案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，或应用其他转换，具体取决于您绘制指南针的方式。）

【讨论】：