WEBGL_draw_buffers: drawBuffersWEBGL() method

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

The WEBGL_draw_buffers.drawBuffersWEBGL() method is part of the WebGL API and allows you to define the draw buffers to which all fragment colors are written.

This method is part of the WEBGL_draw_buffers extension.

Note: When using WebGL2, this method is available as gl.drawBuffers() by default and the constants are named gl.COLOR_ATTACHMENT1 etc. without the "WEBGL" suffix.

Syntax

js
drawBuffersWEBGL(buffers)

Parameters

buffers

An Array of GLenum constants defining drawing buffers. Possible values:

  • gl.NONE: The fragment shader is not written to any color buffer.
  • gl.BACK: The fragment shader is written to the back color buffer.
  • ext.COLOR_ATTACHMENT0_WEBGL The fragment shader is written the n-th color attachment of the framebuffer.
  • ext.COLOR_ATTACHMENT1_WEBGL
  • ext.COLOR_ATTACHMENT2_WEBGL
  • ext.COLOR_ATTACHMENT3_WEBGL
  • ext.COLOR_ATTACHMENT4_WEBGL
  • ext.COLOR_ATTACHMENT5_WEBGL
  • ext.COLOR_ATTACHMENT6_WEBGL
  • ext.COLOR_ATTACHMENT7_WEBGL
  • ext.COLOR_ATTACHMENT8_WEBGL
  • ext.COLOR_ATTACHMENT9_WEBGL
  • ext.COLOR_ATTACHMENT10_WEBGL
  • ext.COLOR_ATTACHMENT11_WEBGL
  • ext.COLOR_ATTACHMENT12_WEBGL
  • ext.COLOR_ATTACHMENT13_WEBGL
  • ext.COLOR_ATTACHMENT14_WEBGL
  • ext.COLOR_ATTACHMENT15_WEBGL

Return value

None (undefined).

Examples

See WEBGL_draw_buffers for more context with this example code.

js
ext.drawBuffersWEBGL([
  ext.COLOR_ATTACHMENT0_WEBGL, // gl_FragData[0]
  ext.COLOR_ATTACHMENT1_WEBGL, // gl_FragData[1]
  ext.COLOR_ATTACHMENT2_WEBGL, // gl_FragData[2]
  ext.COLOR_ATTACHMENT3_WEBGL, // gl_FragData[3]
]);

Specifications

Specification
WebGL WEBGL_draw_buffers Khronos Ratified Extension Specification

Browser compatibility

desktop mobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
drawBuffersWEBGL
Chrome – Full support
Chrome 36 (Release date: 2014-07-16)
footnote Full support
Edge – Full support
Edge 17 (Release date: 2018-04-30)
footnote Full support
Firefox – Full support
Firefox 28 (Release date: 2014-03-18)
footnote Full support
Opera – Full support
Opera 23 (Release date: 2014-07-22)
footnote Full support
Safari – Full support
Safari 9 (Release date: 2015-09-30)
footnote Full support
Chrome Android – No support
Chrome Android
footnote No support
Firefox for Android – No support
Firefox for Android
footnote No support
Opera Android – No support
Opera Android
footnote No support
Safari on iOS – Full support
Safari on iOS 15 (Release date: 2021-09-20)
footnote Full support
Samsung Internet – No support
Samsung Internet
footnote No support
WebView Android – No support
WebView Android
footnote No support
WebView on iOS – Full support
WebView on iOS 15 (Release date: 2021-09-20)
footnote Full support

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
No support
No support

See also