如何获得褪色的反射？

Question

我正在尝试使用reflector class来创建一个这样的反射表面，其中反射对象自然会消失：

默认反射完全牢固。

如何实现自然的淡入淡出效果？另外，是否对Reflector类中的某些选项（例如clipBias和recursion）进行了说明？

Answer 1

让我们以此开始：

  

此外，是否对Reflector类中的某些选项（例如clipBias和递归）进行了描述

不。请注意，您链接的文件位于/examples文件夹中，而不位于/src文件夹中。这意味着它除了以下以外，都不是three.js的一部分：

  

一个人，使用three.js进行了示例，并将其推送到主存储库中。

与大部分已记录的核心（有时不同步或可能使用更多的文档）不同，这些文档未涵盖示例。您可能会发现最多的是代码中的注释。

我试图在high level overview of three.js.

中解决此问题

接下来，如果您希望得到类似的信息：

myReflector.fadedReflections = true

它可能不存在。首先，您可能正在寻找某种fresnel效果，因此也许有一个选择。

如果不这样做，则反射器类将受到相当大的限制，但可能做的仅比其应有的多。

需要做的大部分工作是弄清楚相机在镜子中的位置，从镜子中看到的东西，然后将其有效地渲染为“渲染目标”（纹理），以便其他材料也可以使用。假设您的地板由5个不同的部分组成，每个部分具有不同的材质（金，大理石，木材...），则它们都将使用相同的反射纹理。

我看到问题的方式是-内置Material中没有此类反射的插槽。它必须映射到屏幕空间中的对象上，而不是UV中，并且必须以某种方式集成到照明模型中。

例如，如果要在MeshStandardMaterial上使用它，“淡入淡出”将变为“运行PBR光线和反射的超级复杂数学”。

Three.js允许您修改这些着色器，但它也涉及i wrote a whole article on it.

如果您想自己定义“淡入淡出”，并且淡化此反射实际上是唯一需要的东西（没有阴影，没有PBR，没有灯光等），则可以编写自己的简单{ {1}}与GLSL。

THREE.ShaderMaterial

片段：

varying vec2 vScreenSpace; //compute this and pass to pixel shader
varying vec3 vNormal; //we need  the normal vector to compute the effect
varying vec3 vViewSpace; //we need the point to eye vector for the effect
void main(){
  vNormal = normalMatrix * normal;
  vec4 viewPosition = modelViewMatrix * vec4(position,1.);
  vViewSpace = -viewPosition.xyz;
  gl_Position = projectionMatrix * viewPosition;
  vScreenSpace = gl_Position.xy * 0.5 + 0.5;
}

因此，如果您希望这种效果发生，则必须沿着这条线运行。这是一个超级简单的伪造的“菲涅耳”，因此，如果您希望将其很好地混入PBR材料中，则此数学运算将变得更加复杂。

您可以在一个简单的着色器中测试GLSL的片段，然后将其注入内置材料中的适当位置。