javascript - 在ThreeJS中思考水

ThreeJS中的The "ocean" example非常好，因为太阳反射在水面上并且看起来很逼真。我正在尝试复制它，但是我仍然需要理解一部分代码。

海洋示例构造了一个水对象和一个天空对象。然后，它构造一个CubeCamera并将该照相机的渲染目标用作场景的背景。到目前为止，如此清晰。代码看起来像这样，但有很多细节被我压制了:

scene = new Scene();
water = new Water();
sky = new Sky();
scene.add( water );

cubeCamera = new CubeCamera();
scene.background = cubeCamera.renderTarget;

cubeCamera.update( renderer, sky );

我可以理解除最后一行以外的所有内容:cubeCamera.update( renderer, sky );
In the ThreeJS docs，它说CubeCamera.update()的最后一个参数必须是一个场景，而不是天空。我无法理解为什么此示例完全有效，因为Sky与Scene具有不同的方法。

但是，代码行似乎真的很重要，因为当我删除它时，再也没有太阳了。

有人可以启发我并告诉我为什么它起作用吗？

最佳答案

在Three.js中，Scene只是Object3D的扩展。唯一的区别在于，它可以接受.background和.fog参数，并进行相应处理。

在Three.js核心中未实现Skybox对象。这是示例特定的实现，可以由用户用作引用。如果看一下实现，只不过是带有Mesh和自定义着色器 Material 的BoxGeometry。反过来，它也是Object3D。

尽管文档中有说明，您也不需要在cubeCamera上渲染场景，就像在任何three.js项目中都不需要场景一样。一切都可以用Object3D代替。 (您可能会遇到一些麻烦，但这在大多数情况下都是正确的)

最后，这完全取决于您要达到的目的。在此示例中，cubeCamera用于模拟天空盒，该天空盒与场景中的内容无关。

更加common use，是为场景中的对象创建一个环境图。在这种情况下，使用实际场景创建 map 是有意义的。检查此示例后面的反射球。