WebGLRenderingContext.bindFramebuffer()

The WebGLRenderingContext.bindFramebuffer() method of the WebGL API binds a given WebGLFramebuffer to a target.

Syntax

void gl.bindFramebuffer(target, framebuffer);

Parameters

target

A GLenum specifying the binding point (target). Possible values:

  • gl.FRAMEBUFFER: Collection buffer data storage of color, alpha, depth and stencil buffers used to render an image.
  • When using a WebGL 2 context, the following values are available additionally:
    • gl.DRAW_FRAMEBUFFER: Equivalent to gl.FRAMEBUFFER. Used as a destination for drawing, rendering, clearing, and writing operations.
    • gl.READ_FRAMEBUFFER: Used as a source for reading operations.
framebuffer

A WebGLFramebuffer object to bind. If framebuffer is null, then the canvas (which has no WebGLFramebuffer object) is bound.

Return value

None.

Exceptions

A gl.INVALID_ENUM error is thrown if target is not gl.FRAMEBUFFER, gl.DRAW_FRAMEBUFFER, or gl.READ_FRAMEBUFFER.

Examples

Binding a frame buffer

var canvas = document.getElementById('canvas');
var gl = canvas.getContext('webgl');
var framebuffer = gl.createFramebuffer();

gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);

Getting current bindings

To check the current frame buffer binding, query the FRAMEBUFFER_BINDING constant.

gl.getParameter(gl.FRAMEBUFFER_BINDING);

Specifications

Browser compatibility

Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari WebView Android Chrome Android Firefox for Android Opera Android Safari on IOS Samsung Internet
bindFramebuffer
9
12
4
11
12
5.1
≤37
25
Yes
12
8
1.5
WebGL2
56
79
51
No
43
No
58
58
51
43
No
7.0

See also

© 2005–2021 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/bindFramebuffer