什么情况下需要使用renderer.outputEncoding = THREE.sRGBEncoding

Question

什么情况下需要使用renderer.outputEncoding = THREE.sRGBEncoding

4

我是一个three.js的新手，通过尝试制作简单场景并理解官方示例的工作原理来学习three.js。

最近我在查看https://threejs.org/examples/?q=trans#webgl_materials_physical_transmission，但我不明白为什么代码需要在这里使用renderer.outputEncoding = THREE.sRGBEncoding。在较简单的场景中，例如在立方体上加载JPG纹理，即使没有设置渲染器的outputEncoding，JPG图像看起来也很好。

我尝试在类似伽马校正的主题上进行谷歌搜索，以及一些人声称在线上的大多数图像都是在sRGB颜色空间中进行伽马编码等内容。但我自己无法连接所有的点......如果有人能够清晰地向我解释这个问题，我将不胜感激。

- Arky

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Mugen87 · Accepted Answer

如果您不触及renderer.outputEncoding，意味着您的应用程序中没有使用颜色空间工作流。引擎假设所有输入颜色值都应该在线性空间中。并且每个片段的最终颜色值不会转换为输出颜色空间。

这种工作流程有不同的问题。其中一个原因是您的JPG纹理很可能也编码为sRGB以及许多其他纹理。为了在片段着色器中计算正确的颜色，重要的是将所有输入颜色值转换为相同的颜色空间（即线性颜色空间）。如果您不关心颜色空间，则会很快出现错误的输出颜色。

对于简单的应用程序，这个细节通常并不重要，因为最终图像看起来“很好”。然而，根据您在应用程序中所做的事情（例如导入glTF资产时），适当的颜色空间工作流是强制性的。

通过设置renderer.outputEncoding = THREE.sRGBEncoding，您告诉渲染器将片段着色器中的最终颜色值从线性颜色空间转换为sRGB颜色空间。因此，您还必须告诉渲染器何时纹理包含sRGB编码数据。您可以通过将THREE.sRGBEncoding分配给纹理的encoding属性来实现这一点。 THREE.GLTFLoader会自动为所有彩色纹理执行此操作。但是，当手动加载纹理时，您必须自己执行此操作。