WebGL2 FBO深度附着值 [英] WebGL2 FBO depth attachment values
本文介绍了WebGL2 FBO深度附着值的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我只是尝试使用WebGL2呈现场景的深度值,如下所示:
//Texture
depthTexture = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, depthTexture);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.DEPTH_COMPONENT24,
width, height, 0,
gl.DEPTH_COMPONENT, gl.UNSIGNED_INT, null);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
//FBO
fb = gl.createFramebuffer();
gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT, gl.TEXTURE_2D, depthTexture, 0);
gl.bindFramebuffer(gl.FRAMEBUFFER, null);
然后我这样呈现它:
gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
gl.useProgram(shaderProgram);
//Just a torus...
gl.bindVertexArray(vao);
gl.colorMask(false, false, false, false);
gl.enable(gl.DEPTH_TEST);
gl.clear(gl.DEPTH_BUFFER_BIT);
...
gl.drawElements(gl.TRIANGLES, indices.length, gl.UNSIGNED_SHORT,0);
//Then I draw a full screen quad that simply samples the depth texture
gl.bindFramebuffer(gl.FRAMEBUFFER, null)
....
它似乎工作得很好,但是当对附加的深度纹理进行采样时,我得到的结果看起来像是线性深度……
我用来渲染到FBO中的程序非常基本
垂直:
#version 300 es
layout(location = 0) in vec3 position;
uniform mat4 projection;
uniform mat4 view;
uniform mat4 model;
void main() {
gl_Position = projection * view * model * vec4(position, 1.);
}
碎片:
#version 300 es
precision highp float;
layout(location = 0) out vec4 outColor;
void main() {
outColor = vec4(1,0,0,1)
}
我期望深度缓冲区是对数的,即使我不能确定我当前得到的是否真的是线性的,它看起来也不是对数的…… 如果它真的是线性的,不知何故,这就是您应该从深度连接中得到的,我完全可以接受,因为我可能需要线性而不是对数深度,但目前我不确定这是预期的行为,还是我做错了什么(可能是后者)
干杯
推荐答案
感谢@lj的链接。 我想我知道实际发生了什么。我之前的结论是不正确的,主要是因为我不明白发生了什么。 我看到的是,正如预期的对数深度,但是因为我的近处和远处的剪裁平面是1。和1000。环面与近裁剪平面相对较近,是1/z曲线上数值聚集的那部分,具有较高的精度。一旦我增加了圆环的深度,我就看到了很大的精度损失。在使用How to read depth texture attached to FBO in WebGL2之类的东西线性化之后,使用0.1和10的近剪裁平面和远剪裁平面(为了获得视觉反馈,因为圆环的深度相对较小),我可以看到深度是线性的。
这篇关于WebGL2 FBO深度附着值的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文