是否可以在深度纹理上使用 texSubImage2D？

Question

I'm following this tutorial on 2D shadow mapping and I've gotten it working in WebGL. Now, I am looking to develop a way to recompute single rows in the depth texture, without clearing the entire texture and recomputing every light's value.

My depth texture is a regular WebGLTexture made like this:

gl.texImage2D(gl.TEXTURE_2D, 0, gl.DEPTH_COMPONENT, width, height, 0, gl.DEPTH_COMPONENT, gl.UNSIGNED_SHORT, null);

To do this, I had the idea to do something like this:

let SHADOW_MAP_WIDTH = 360;

let emptyDepthValues = new Array(SHADOW_MAP_WIDTH * 4).fill(255);
let emptyDepthRow = new Uint8Array(emptyDepthValues);

// down further..

gl.bindTexture(gl.TEXTURE_2D, this.shadowMapFramebuffer.depthTexture);
gl.texSubImage2D(gl.TEXTURE_2D, 0, 0, slot, SHADOW_MAP_WIDTH, 1, gl.RGBA, gl.UNSIGNED_BYTE, emptyDepthRow);

this.shadowMapper.computeRow(vertices, lightPosition, lightSlot, lightRadius);

Unfortunately, it does not seem to be working. I know this because if I move the calls to bindTexture and texSubImage2D to after the computeRow function, the values still persist. That is, they are not reset to the defaults by the call to texSubImage2D .

I'm currently using WebGL 1 (with the depth texture extension) and would preferably like to keep doing so if possible. All I'm looking for is a trivial way to reset a row in my WebGLTexture to its default value.

Answer 1

Ah, I had a better idea. Since I only need to reset the depth values for a specific row, I can just write a function like this, which works perfectly:

function clearShadowMapSlot(gl, slot, shadowMapWidth) {
  gl.enable(gl.SCISSOR_TEST);

  gl.scissor(0, slot, shadowMapWidth, 1);
  gl.clear(gl.DEPTH_BUFFER_BIT);

  gl.disable(gl.SCISSOR_TEST);
}