How to clear a rectangle area in WebGL?

问题

WebGL has a clear method that clears an entire surface. What's the best way to clear just a particular rectangle of the surface? For example I want to set a 100x100 box of pixels starting at (50, 50) to all zeroes (ARGB 0, 0, 0, 0). All I can think of right now is drawing a quad with a fragment shader that writes zeroes. Is there not an easier way?

回答1:

You can use the SCISSOR test to constrain clearing (and rendering in general) to a rectangle.

// turn on the scissor test.
gl.enable(gl.SCISSOR_TEST);

// set the scissor rectangle.
gl.scissor(x, y, width, height);

// clear.
gl.clearColor(r, g, b, a);
gl.clear(gl.COLOR_BUFFER_BIT ...);

// turn off the scissor test so you can render like normal again.
gl.disable(gl.SCISSOR_TEST);

回答2:

anything outside the viewport if within the webgl context will be drawn, anything outside scissor will be clipped and not drawn at all !

来源：https://stackoverflow.com/questions/11544608/how-to-clear-a-rectangle-area-in-webgl