2

我是three.js 和WebGL 的新手。

在我的应用程序中，有两个对象在其中的 3D 场景。

  1. 对象 - 它是一个大球体；
  2. 对象 - 一个较小的球体，位于第一个对象的表面上。

大球体围绕其轴旋转。并且还可以围绕球体旋转相机。

所以作为一个大球体表面的一个小球体，它也随之旋转。当大球体转向相机时，我们会看到小球体，而当大球体在它前面时，它就不会被看到。

问题是，我如何确定一个小球体何时对相机可见，何时不可见？

此外，我需要获取可见的小球体的 2d 坐标。我怎样才能做到这一点？

4

1 回答 1

1

这可以通过 three.js 的内置raycaster和projector功能来完成。首先，请尝试查看此演示及其源代码。这是另一个例子。通过这种方式，您可以确定哪些对象更接近从相机位置发出的不可见线。

否则，如果您只是对两个对象中哪个更靠近相机感兴趣，您可以简单地检查它们的哪些位置值与相机坐标的距离更小。三维距离公式会派上用场：

bigSphereDistance = Math.sqrt( Math.pow(camera.position.x - big.position.x,2) +
                               Math.pow(camera.position.y - big.position.y,2) +
                               Math.pow(camera.position.z - big.position.z,2) );
smallSphereDistance = Math.sqrt( Math.pow(camera.position.x - small.position.x,2) +
                                 Math.pow(camera.position.y - small.position.y,2) +
                                 Math.pow(camera.position.z - small.position.z,2) );
//then check...
bigSphereDistance > smallSphereDistance ? /*case*/ : /*case*/;

直观地说，当小球的距离小于大球的距离时，小球是可见的，并带有小球半径的缓冲区。

要回答您的第二个问题，查找任何对象的 2D 坐标都可以像这样完成。

于 2013-10-03T18:09:05.940 回答