深度图像 webgl

Depth image webgl

我想按以下方式只绘制没有任何颜色的深度图:

这可能吗?如果是这样,有人可以为我指出正确的资源以获取此信息或给出有关相同信息的基本解释吗?

在 WebGL 中没有直接的方法来可视化深度缓冲区的实际内容。但是,绘制深度很容易;这基本上与绘制雾(以旧的固定功能样式)相同。

在您的顶点着色器中,通过 varying 传递顶点位置的 z 分量。当你在它的时候,重新调整它的范围从 [-1, 1] 到 [0, 1].

// do this after you've set gl_Position, of course.
vZ = (gl_Position.z + 1.0) / 2.0;

在您的片段着色器中,使用此值作为颜色。

gl_FragColor = vec4(vZ, vZ, vZ, 0.0);

请注意,这将产生非线性的阴影,就像实际深度缓冲区值是非线性的一样。如果你想要从近平面到远平面的线性亮度,你需要在投影变换之前从获取z坐标,并根据近平面和远平面重新缩放它距离.