Framebuffer Objects

The framebuffer object itself is a collection of textures, as we have just defined. Framebuffer objects are created and deleted just like texture objects, vertex buffer objects, program objects, etc. And, like these, exactly one framebuffer object is bound for use at any time.

framebufferObjectgl.createFramebuffer()
gl.bindFramebuffer(gl.FRAMEBUFFER, framebufferObject)

Once created and bound, our color and depth textures are attached to the framebuffer object's COLOR_ATTACHMENT0 and DEPTH_ATTACHMENT attributes.

gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, colorTexture, 0)
gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT, gl.TEXTURE_2D, depthTexture, 0)

The default framebuffer object, null, represents the on-screen framebuffer. It is very important to rebind the default framebuffer object after finishing with any other framebuffer object, to ensure that any subsequent rendering is sent to the screen as expected.

gl.bindFramebuffer(gl.FRAMEBUFFER, null)