How to Clear WebGLRenderTarget Textures with multiple attachments with different Colors in Three.js

Hi,

I’m using WebGLMultipleRenderTargets in Three.js to implement a G-buffer with two attachments:

  1. textures[0]: stores normals
  2. textures[1]: stores depth

Here’s how I create it:

const target = new WebGLRenderTarget(width, height, {
    format: RGBAFormat,
    count: 2,
    minFilter: NearestFilter,
    magFilter: NearestFilter,
    stencilBuffer: false
});

target.textures[0].name = 'normal';
target.textures[0].type = FloatType;

target.textures[1].name = 'depth';
target.textures[1].type = FloatType;

I’d like to clear each texture with a different color before rendering i.e.:

  1. textures[0] to (0, 0, 1, 1)
  2. textures[1] to (1, 1, 1, 1)

Using renderer.setClearColor() and renderer.clear() affects all attachments equally.

I also tried raw WebGL:

const gl = renderer.getContext();
renderer.setRenderTarget(target);
gl.drawBuffers([gl.COLOR_ATTACHMENT0, gl.COLOR_ATTACHMENT1]);

gl.clearBufferfv(gl.COLOR, 0, [0, 0, 1, 1]);
gl.clearBufferfv(gl.COLOR, 1, [1, 1, 1, 1]);

But this doesn’t seem to have any effects.

Is there a way to clear MRT attachments individually with different colors?

Thanks!