WebGLRenderingContext.framebufferTexture2D()

The WebGLRenderingContext.framebufferTexture2D() method of the WebGL API attaches a texture to a WebGLFramebuffer.

Syntax

JavaScript
void <var>gl</var>.framebufferTexture2D(<var>target</var>, <var>attachment</var>, <var>textarget</var>, <var>texture</var>, <var>level</var>);

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.
attachment
A GLenum specifying the attachment point for the texture. Possible values:
  • gl.COLOR_ATTACHMENT0: Attaches the texture to the framebuffer's color buffer.
  • gl.DEPTH_ATTACHMENT: Attaches the texture to the framebuffer's depth buffer.
  • gl.STENCIL_ATTACHMENT: Attaches the texture to the framebuffer's stencil buffer.
  • When using a WebGL 2 context, the following values are available additionally:
    • gl.DEPTH_STENCIL_ATTACHMENT: depth and stencil buffer.
    • gl.COLOR_ATTACHMENT1<br>
           gl.COLOR_ATTACHMENT2<br>
           gl.COLOR_ATTACHMENT3<br>
           gl.COLOR_ATTACHMENT4<br>
           gl.COLOR_ATTACHMENT5<br>
           gl.COLOR_ATTACHMENT6<br>
           gl.COLOR_ATTACHMENT7<br>
           gl.COLOR_ATTACHMENT8<br>
           gl.COLOR_ATTACHMENT9<br>
           gl.COLOR_ATTACHMENT10<br>
           gl.COLOR_ATTACHMENT11<br>
           gl.COLOR_ATTACHMENT12<br>
           gl.COLOR_ATTACHMENT13<br>
           gl.COLOR_ATTACHMENT14<br>
           gl.COLOR_ATTACHMENT15
  • When using the WEBGL_draw_buffers extension:
    • ext.COLOR_ATTACHMENT0_WEBGL (same as gl.COLOR_ATTACHMENT0)
      ext.COLOR_ATTACHMENT1_WEBGL<br>
           ext.COLOR_ATTACHMENT2_WEBGL<br>
           ext.COLOR_ATTACHMENT3_WEBGL<br>
           ext.COLOR_ATTACHMENT4_WEBGL<br>
           ext.COLOR_ATTACHMENT5_WEBGL<br>
           ext.COLOR_ATTACHMENT6_WEBGL<br>
           ext.COLOR_ATTACHMENT7_WEBGL<br>
           ext.COLOR_ATTACHMENT8_WEBGL<br>
           ext.COLOR_ATTACHMENT9_WEBGL<br>
           ext.COLOR_ATTACHMENT10_WEBGL<br>
           ext.COLOR_ATTACHMENT11_WEBGL<br>
           ext.COLOR_ATTACHMENT12_WEBGL<br>
           ext.COLOR_ATTACHMENT13_WEBGL<br>
           ext.COLOR_ATTACHMENT14_WEBGL<br>
           ext.COLOR_ATTACHMENT15_WEBGL
  • When using the WEBGL_depth_texture extension:
    • ext.DEPTH_STENCIL_ATTACHMENT: Depth and stencil buffer data storage.
textarget
A GLenum specifying the texture target. Possible values:
  • gl.TEXTURE_2D: A 2D image.
  • gl.TEXTURE_CUBE_MAP_POSITIVE_X: Image for the positive X face of the cube.
  • gl.TEXTURE_CUBE_MAP_NEGATIVE_X: Image for the negative X face of the cube.
  • gl.TEXTURE_CUBE_MAP_POSITIVE_Y: Image for the positive Y face of the cube.
  • gl.TEXTURE_CUBE_MAP_NEGATIVE_Y: Image for the negative Y face of the cube.
  • gl.TEXTURE_CUBE_MAP_POSITIVE_Z: Image for the positive Z face of the cube.
  • gl.TEXTURE_CUBE_MAP_NEGATIVE_Z: Image for the negative Z face of the cube.
texture
A WebGLTexture object whose image to attach.
level
A GLint specifying the mipmap level of the texture image to be attached. Must be 0.

Return value

None.

Exceptions

  • A gl.INVALID_ENUM error is thrown if
    • target is not gl.FRAMEBUFFER.
    • attachment is not one of the accepted attachment points.
    • textarget is not one of the accepted texture targets.
  • A gl.INVALID_VALUE error is thrown if level is not 0.
  • A gl.INVALID_OPERATION error is thrown if texture isn't 0 or the name of an existing texture object.

Examples

JavaScript
gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE2D, texture, 0);

Specifications

Specification Status Comment
WebGL 1.0
The definition of 'framebufferTexture2D' in that specification.
Recommendation Initial definition.
OpenGL ES 2.0
The definition of 'glFramebufferTexture2D' in that specification.
Standard Man page of the (similar) OpenGL ES 2 API.
OpenGL ES 3.0
The definition of 'glFramebufferTexture2D' in that specification.
Standard Man page of the (similar) OpenGL ES 3 API.

Browser compatibility

Feature Chrome Edge Firefox (Gecko) Internet Explorer Opera Safari
Basic support 9 12 4.0 (2.0) 11 12 5.1
WebGL 2 No support [2] No support Nightly build [1] No support No support No support
Feature Android Chrome for Android Firefox Mobile (Gecko) Firefox OS IE Mobile Opera Mobile Safari Mobile
Basic support ? 25 4.0 (2.0) 1.0 ? 12 8.0
WebGL 2 No support No support No support No support No support No support No support

[1] WebGL 2 is enabled by default in Firefox Nightly. To enable it in a release version of Firefox, set the preference webgl.enable-prototype-webgl2 to true in about:config.

[2] To use an experimental implementation of WebGL 2 in Chrome, you have to start Chrome with the runtime flag --enable-unsafe-es3-apis.

See also

License

© 2016 Mozilla Contributors
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-us/docs/web/api/webglrenderingcontext/framebuffertexture2d

API Method Reference WebGL WebGLRenderingContext