如何在WebGL2中读取附加到FBO的深度纹理

Question

我现在正在使用WebGL2.0进行延迟着色。 我现在面临的一个主要问题是我无法从DEPTH_ATTACHMENT中读取深度值。 实际上，我创建了一个带有DEPTH24_STENCIL8纹理的GBuffer作为DEPTH_ATTACHMENT，然后将该纹理绑定到采样器，并尝试在片段着色器中的延迟着色部分读取值，如下所示：

uniform sampler2D u_depthSampler;
vec4 depthValue = texture(u_depthSampler, v_uv);

然后在我的着色片段着色器中将depthValue设置为输出：

layout(location = 0) out vec4 o_fragOut;
o_fragColor.xyz = depthValue.xyz;
o_fragColor.w = 1.0;

在Firefox上执行此操作时，它没有报告任何错误，但输出颜色只是纯红色（我认为这意味着vec3（1.0，0.0，0.0））。 这真的让我很困惑。 谁能提供一些指导？ 我的glsl代码有什么问题吗？ THX〜

Answer 1

深度缓冲区不是线性的。 要使其线性化，请使用以下公式：

float f = 1000.0; //far plane
float n = 1.0; //near plane
float z = (2.0 * n) / (f + n - texture2D( diffuse, texCoord ).x * (f - n));

gl_FragColor = vec4(z,z,z, 255)

Answer 2

抱歉，我可能犯了一个大错误，即深度纹理实际上几乎是纯红色，但不是真正的红色。 我尝试了这个：

float depthPow = pow(depthValue.x, 10.0);
o_fragOut.xyz = vec3(depthPow);

我认为我得到了正确的结果。