recursal/MDN huggingface dataset:
WebGLRenderingContext: isContextLost() method
=============================================

 The
 **`WebGLRenderingContext.isContextLost()`** method returns a
 boolean value indicating whether or not the WebGL context has been lost and
 must be re-established before rendering can resume.

Syntax
------


```js
isContextLost()
```

### Parameters

None.

### Return value

 A boolean value which is `true` if the context is lost, or
 `false` if not.

Usage notes
-----------

 There are several reasons why a WebGL context may be lost, making it necessary to
 re-establish the context before resuming rendering. Examples include:

* Two or more pages are using the GPU, but together place too high a demand on the
 GPU, so the browser tells the two contexts that they've lost the connection, then
 selects one of the two to restore access for.
* The user's computer has multiple graphics processors (such as a laptop with both
 mobile and desktop class GPUs, the former used primarily when on battery power), and
 the user or system decides to switch GPUs. In this case, all contexts are lost, then
 restored after switching GPUs.
* Another page running in the user's browser performs an operation using the GPU that
 takes too long, causing the browser to decide to reset the GPU in order to break the
 stall. This would cause every WebGL context to be lost throughout the entire browser.
* The user updates their graphics driver on an operating system that allows graphics
 drivers to be updated without restarting the system.
Examples
--------

 For example, when checking for program linking success, you could also check if the
 context is not lost:


```js
gl.linkProgram(program);

if (!gl.getProgramParameter(program, gl.LINK\_STATUS) && !gl.isContextLost()) {
  const info = gl.getProgramInfoLog(program);
  console.log(`Error linking program:\n${info}`);
}
```

Specifications
--------------

| Specification |
| --- |
| WebGL Specification # 5.14.13 |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* The `WebGLContextEvent` signals changes in the context state.
* Handling lost context in WebGL: Khronos WebGL wiki
WebGLRenderingContext: getUniform() method
==========================================

 The **`WebGLRenderingContext.getUniform()`** method of the WebGL API returns the value of a uniform
 variable at a given location.

Syntax
------


```js
getUniform(program, location)
```

### Parameters

`program`

A `WebGLProgram` containing the uniform attribute.

`location`

 A `WebGLUniformLocation` object containing the location of the uniform
 attribute to get.


### Return value

The returned type depends on the uniform type:

| Uniform type | Returned type |
| --- | --- |
| WebGL 1 only |
| --- |
| `boolean` | `GLBoolean` |
| `int` | `GLint` |
| `float` | `GLfloat` |
| `vec2` | `Float32Array` (with 2 elements) |
| `ivec2` | `Int32Array` (with 2 elements) |
| `bvec2` | `Array` of
 `GLBoolean` (with 2
 elements)
  |
| `vec3` | `Float32Array` (with 3 elements) |
| `ivec3` | `Int32Array` (with 3 elements) |
| `bvec3` | `Array` of
 `GLBoolean` (with 3
 elements)
  |
| `vec4` | `Float32Array` (with 4 elements) |
| `ivec4` | `Int32Array` (with 4 elements) |
| `bvec4` | `Array` of
 `GLBoolean` (with 4
 elements)
  |
| `mat2` | `Float32Array` (with 4 elements) |
| `mat3` | `Float32Array` (with 9 elements) |
| `mat4` | `Float32Array` (with 16 elements) |
| `sampler2D` | `GLint` |
| `samplerCube` | `GLint` |
| Additionally available in WebGL 2 |
| `uint` | `GLuint` |
| `uvec2` | `Uint32Array` (with 2 elements) |
| `uvec3` | `Uint32Array` (with 3 elements) |
| `uvec4` | `Uint32Array` (with 4 elements) |
| `mat2x3` | `Float32Array` (with 6 elements) |
| `mat2x4` | `Float32Array` (with 8 elements) |
| `mat3x2` | `Float32Array` (with 6 elements) |
| `mat3x4` | `Float32Array` (with 12 elements) |
| `mat4x2` | `Float32Array` (with 8 elements) |
| `mat4x3` | `Float32Array` (with 12 elements) |
| any sampler type | `GLint` |

Examples
--------


```js
const loc = gl.getUniformLocation(program, "u\_foobar");
gl.getUniform(program, loc);
```

Specifications
--------------

| Specification |
| --- |
| WebGL Specification # 5.14.10 |
| WebGL 2.0 Specification # 3.7.8 |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `WebGLUniformLocation`
* `WebGLRenderingContext.getActiveUniform()`
WebGLRenderingContext: depthRange() method
==========================================

 The **`WebGLRenderingContext.depthRange()`** method of the WebGL API specifies the depth range mapping
 from normalized device coordinates to window or viewport coordinates.

Syntax
------


```js
depthRange(zNear, zFar)
```

### Parameters

`zNear`

 A `GLclampf` specifying the mapping of the near clipping plane to
 window or viewport coordinates. Clamped to the range 0 to 1 and must be less than or
 equal to `zFar`. The default value i`s 0.`

`zFar`

 A `GLclampf` specifying the mapping of the far clipping plane to window
 or viewport coordinates. Clamped to the range 0 to 1. The default value
 i`s 1.`

### Return value

None (`undefined`).

Examples
--------


```js
gl.depthRange(0.2, 0.6);
```


 To check the current depth range, query the `DEPTH_RANGE` constant which
 returns a `Float32Array`


```js
gl.getParameter(gl.DEPTH\_RANGE);
// Float32Array[0.2, 0.6]
```

Specifications
--------------

| Specification |
| --- |
| WebGL Specification # 5.14.3 |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `WebGLRenderingContext.viewport()`
* `WebGLRenderingContext.depthFunc()`
WebGLRenderingContext: deleteFramebuffer() method
=================================================

 The **`WebGLRenderingContext.deleteFramebuffer()`** method of
 the WebGL API deletes a given
 `WebGLFramebuffer` object. This method has no effect if the frame buffer
 has already been deleted.

Syntax
------


```js
deleteFramebuffer(framebuffer)
```

### Parameters

`framebuffer`

A `WebGLFramebuffer` object to delete.

### Return value

None (`undefined`).

Examples
--------

### Deleting a frame buffer


```js
const canvas = document.getElementById("canvas");
const gl = canvas.getContext("webgl");
const framebuffer = gl.createFramebuffer();

// …

gl.deleteFramebuffer(framebuffer);
```

Specifications
--------------

| Specification |
| --- |
| WebGL Specification # 5.14.6 |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `WebGLRenderingContext.bindFramebuffer()`
* `WebGLRenderingContext.createFramebuffer()`
* `WebGLRenderingContext.isFramebuffer()`
* Other buffers: `WebGLBuffer`, `WebGLRenderbuffer`
WebGLRenderingContext: stencilFunc() method
===========================================

 The **`WebGLRenderingContext.stencilFunc()`** method of the WebGL API sets the front and back function
 and reference value for stencil testing.

 Stenciling enables and disables drawing on a per-pixel basis. It is typically used in
 multipass rendering to achieve special effects.

Syntax
------


```js
stencilFunc(func, ref, mask)
```

### Parameters

`func`

 A `GLenum` specifying the test function. The default function is
 `gl.ALWAYS`. The possible values are:


* `gl.NEVER`: Never pass.
* `gl.LESS`: Pass if
 `(ref & mask) < (stencil & mask)`.
* `gl.EQUAL`: Pass if
 `(ref & mask) = (stencil & mask)`.
* `gl.LEQUAL`: Pass if
 `(ref & mask) <= (stencil & mask)`.
* `gl.GREATER`: Pass if
 `(ref & mask) > (stencil & mask)`.
* `gl.NOTEQUAL`: Pass if
 `(ref & mask) !== (stencil & mask)`.
* `gl.GEQUAL`: Pass if
 `(ref & mask) >= (stencil & mask)`.
* `gl.ALWAYS`: Always pass.

`ref`

 A `GLint` specifying the reference value for the stencil test. This
 value is clamped to the range 0 to 2^n - 1 where n is the number of bitplanes
 in the stencil buffer. The default value is 0.


`mask`

 A `GLuint` specifying a bit-wise mask that is used to AND the reference
 value and the stored stencil value when the test is done. The default value is all 1.


### Return value

None (`undefined`).

Examples
--------

 The stencil testing is disabled by default. To enable or disable stencil testing, use
 the `enable()` and
 `disable()` methods with the argument
 `gl.STENCIL_TEST`.


```js
gl.enable(gl.STENCIL\_TEST);
gl.stencilFunc(gl.LESS, 0, 0b1110011);
```


 To get the current stencil function, reference value, or other stencil information,
 query the following constants with `getParameter()`.


```js
gl.getParameter(gl.STENCIL\_FUNC);
gl.getParameter(gl.STENCIL\_VALUE\_MASK);
gl.getParameter(gl.STENCIL\_REF);
gl.getParameter(gl.STENCIL\_BACK\_FUNC);
gl.getParameter(gl.STENCIL\_BACK\_VALUE\_MASK);
gl.getParameter(gl.STENCIL\_BACK\_REF);
gl.getParameter(gl.STENCIL\_BITS);
```

Specifications
--------------

| Specification |
| --- |
| WebGL Specification # 5.14.3 |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `WebGLRenderingContext.stencilFuncSeparate()`
* `WebGLRenderingContext.stencilMask()`
* `WebGLRenderingContext.stencilMaskSeparate()`
* `WebGLRenderingContext.stencilOp()`
* `WebGLRenderingContext.stencilOpSeparate()`
WebGLRenderingContext: drawingBufferHeight property
===================================================

 The read-only **`WebGLRenderingContext.drawingBufferHeight`**
 property represents the actual height of the current drawing buffer. It should match the
 `height` attribute of the `<canvas>` element associated with
 this context, but might differ if the implementation is not able to provide the
 requested height.

Value
-----

A number.

Examples
--------

Given this `<canvas>` element:


```html
<canvas id="canvas"></canvas>
```


You can get the height of the drawing buffer with the following lines:


```js
const canvas = document.getElementById("canvas");
const gl = canvas.getContext("webgl");
gl.drawingBufferHeight; // 150
```

Specifications
--------------

| Specification |
| --- |
| WebGL Specification # DOM-WebGLRenderingContext-drawingBufferHeight |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `WebGLRenderingContext.drawingBufferWidth`
* `WebGLRenderingContext.viewport()`
WebGLRenderingContext: finish() method
======================================

 The **`WebGLRenderingContext.finish()`** method of the WebGL API blocks execution until all
 previously called commands are finished.

Syntax
------


```js
finish()
```

### Parameters

None.

### Return value

None (`undefined`).

Specifications
--------------

| Specification |
| --- |
| WebGL Specification # 5.14.11 |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `WebGLRenderingContext.flush()`
* WebGL best practices (which recommends avoiding `finish()` as it may slow down
 your main rendering loop)
WebGLRenderingContext: viewport() method
========================================

 The **`WebGLRenderingContext.viewport()`** method of the WebGL API sets the viewport, which specifies
 the affine transformation of x and y from normalized device coordinates to window
 coordinates.

Syntax
------


```js
viewport(x, y, width, height)
```

### Parameters

`x`

 A `GLint` specifying the horizontal coordinate for the lower left
 corner of the viewport origin. Default value: 0.


`y`

 A `GLint` specifying the vertical coordinate for the lower left corner
 of the viewport origin. Default value: 0.


`width`

 A non-negative `GLsizei` specifying the width of the viewport. Default
 value: width of the canvas.


`height`

 A non-negative `GLsizei` specifying the height of the viewport. Default
 value: height of the canvas.


### Return value

None (`undefined`).

### Errors thrown

 If either *width* or *height* is a negative value, a
 `gl.INVALID_VALUE` error is thrown.

Examples
--------

 When you first create a WebGL context, the size of the viewport will match the size of
 the canvas. However, if you resize the canvas, you will need to tell the WebGL context a
 new viewport setting. In this situation, you can use `gl.viewport`.


```js
gl.viewport(0, 0, canvas.width, canvas.height);
```


 The viewport width and height are clamped to a range that is implementation dependent.
 To get this range, you can use the `MAX_VIEWPORT_DIMS` constant, which
 returns an `Int32Array`.


```js
gl.getParameter(gl.MAX\_VIEWPORT\_DIMS);
// e.g. Int32Array[16384, 16384]
```


To get the current viewport, query the `VIEWPORT` constant.


```js
gl.getParameter(gl.VIEWPORT);
// e.g. Int32Array[0, 0, 640, 480]
```

Specifications
--------------

| Specification |
| --- |
| WebGL Specification # 5.14.4 |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `WebGLRenderingContext.scissor()`
* `WebGLRenderingContext.getParameter()`
WebGLRenderingContext: isEnabled() method
=========================================

 The **`WebGLRenderingContext.isEnabled()`** method of the WebGL API tests whether a specific WebGL
 capability is enabled or not for this context.

 By default, all capabilities except `gl.DITHER` are
 **disabled**.

Syntax
------


```js
isEnabled(cap)
```

### Parameters

`cap`

A `GLenum` specifying which WebGL capability to test. Possible values:

| Constant | Description |
| --- | --- |
| `gl.BLEND` | Blending of the computed fragment color values. See `WebGLRenderingContext.blendFunc()`. |
| `gl.CULL_FACE` | Culling of polygons. See `WebGLRenderingContext.cullFace()`. |
| `gl.DEPTH_TEST` | Depth comparisons and updates to the depth buffer. See `WebGLRenderingContext.depthFunc()`. |
| `gl.DITHER` | Dithering of color components before they get written to the color buffer. |
| `gl.POLYGON_OFFSET_FILL` | Adding an offset to depth values of polygon's fragments. See `WebGLRenderingContext.polygonOffset()`. |
| `gl.SAMPLE_ALPHA_TO_COVERAGE` | Computation of a temporary coverage value determined by the alpha value. |
| `gl.SAMPLE_COVERAGE` | ANDing the fragment's coverage with the temporary coverage value. See `WebGLRenderingContext.sampleCoverage()`. |
| `gl.SCISSOR_TEST` | Scissor test that discards fragments that are outside of the scissor rectangle. See `WebGLRenderingContext.scissor()`. |
| `gl.STENCIL_TEST` | Stencil testing and updates to the stencil buffer. See `WebGLRenderingContext.stencilFunc()`. |

 When using a WebGL 2 context, the
 following values are available additionally:


| Constant | Description |
| --- | --- |
| `gl.RASTERIZER_DISCARD` | Primitives are discarded immediately before the rasterization stage, but after the optional transform feedback stage. `gl.clear()` commands are ignored. |

### Return value

 A `GLboolean` indicating if the capability *cap* is enabled
 (`true`), or not (`false`).

Examples
--------


```js
gl.isEnabled(gl.STENCIL\_TEST);
// false
```


 To activate or deactivate a specific capability, use the
 `WebGLRenderingContext.enable()` and
 `WebGLRenderingContext.disable()` methods:


```js
gl.enable(gl.STENCIL\_TEST);
gl.disable(gl.STENCIL\_TEST);
```

Specifications
--------------

| Specification |
| --- |
| WebGL Specification # 5.14.3 |
| WebGL 2.0 Specification # 3.7.2 |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `WebGLRenderingContext.enable()`
* `WebGLRenderingContext.disable()`
WebGLRenderingContext: bindTexture() method
===========================================

 The **`WebGLRenderingContext.bindTexture()`** method of the WebGL API binds a given
 `WebGLTexture` to a target (binding point).

Syntax
------


```js
bindTexture(target, texture)
```

### Parameters

`target`

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

* `gl.TEXTURE_2D`: A two-dimensional texture.
* `gl.TEXTURE_CUBE_MAP`: A cube-mapped texture.
 When using a WebGL 2 context,
 the following values are available additionally:
    + `gl.TEXTURE_3D`: A three-dimensional texture.
    + `gl.TEXTURE_2D_ARRAY`: A two-dimensional array texture.

`texture`

A `WebGLTexture` object to bind.

### Return value

None (`undefined`).

### Exceptions

 A `gl.INVALID_ENUM` error is thrown if `target` is not
 `gl.TEXTURE_2D`, `gl.TEXTURE_CUBE_MAP`,
 `gl.TEXTURE_3D`, or `gl.TEXTURE_2D_ARRAY`.

Examples
--------

### Binding a texture


```js
const canvas = document.getElementById("canvas");
const gl = canvas.getContext("webgl");
const texture = gl.createTexture();

gl.bindTexture(gl.TEXTURE\_2D, texture);
```

### Getting current bindings

 To check the current texture binding, query the `gl.TEXTURE_BINDING_2D` or
 `gl.TEXTURE_BINDING_CUBE_MAP` constants.


```js
gl.getParameter(gl.TEXTURE\_BINDING\_2D);
```

Specifications
--------------

| Specification |
| --- |
| WebGL Specification # 5.14.8 |
| WebGL 2.0 Specification # 3.7.1 |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `WebGLRenderingContext.createTexture()`
* `WebGLRenderingContext.deleteTexture()`
* `WebGLRenderingContext.isTexture()`
* `WebGLRenderingContext.texImage2D()`
WebGLRenderingContext: isShader() method
========================================

 The **`WebGLRenderingContext.isShader()`** method of the WebGL API returns `true` if the
 passed `WebGLShader` is valid, `false` otherwise.

Syntax
------


```js
isShader(shader)
```

### Parameters

`shader`

A `WebGLShader` to check.

### Return value

A `GLboolean` indicating whether or not the shader is valid.

Examples
--------

### Checking a shader


```js
const canvas = document.getElementById("canvas");
const gl = canvas.getContext("webgl");
const shader = gl.createShader(gl.VERTEX\_SHADER);

// …

gl.isShader(shader);
```

Specifications
--------------

| Specification |
| --- |
| WebGL Specification # 5.14.9 |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `WebGLRenderingContext.createShader()`
* `WebGLRenderingContext.deleteShader()`
WebGLRenderingContext: bindFramebuffer() method
===============================================

 The **`WebGLRenderingContext.bindFramebuffer()`** method of the
 WebGL API binds to the specified target the provided `WebGLFramebuffer`, or, if the `framebuffer` argument is null, the default `WebGLFramebuffer`, which is associated with the canvas rendering context.

Syntax
------


```js
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 as both a destination for drawing and as a source for reading (see below).



 When using a WebGL 2 context,
 the following values are available additionally:


`gl.DRAW_FRAMEBUFFER`

Used as a destination for drawing operations such as `gl.draw*`, `gl.clear*` and `gl.blitFramebuffer`.

`gl.READ_FRAMEBUFFER`

Used as a source for reading operations such as `gl.readPixels` and `gl.blitFramebuffer`.


`framebuffer`

A `WebGLFramebuffer` object to bind, or `null` for binding the `HTMLCanvasElement` or `OffscreenCanvas` object associated with the rendering context.

### Return value

None (`undefined`).

### 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


```js
const canvas = document.getElementById("canvas");
const gl = canvas.getContext("webgl");
const framebuffer = gl.createFramebuffer();

gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
```

### Getting current bindings

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


```js
gl.getParameter(gl.FRAMEBUFFER\_BINDING);
```

Specifications
--------------

| Specification |
| --- |
| WebGL Specification # 5.14.6 |
| WebGL 2.0 Specification # 3.7.1 |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `WebGLRenderingContext.createFramebuffer()`
* `WebGLRenderingContext.deleteFramebuffer()`
* `WebGLRenderingContext.isFramebuffer()`
* Other buffers: `WebGLBuffer`, `WebGLRenderbuffer`
WebGLRenderingContext: deleteTexture() method
=============================================

 The **`WebGLRenderingContext.deleteTexture()`** method of the
 WebGL API deletes a given
 `WebGLTexture` object. This method has no effect if the texture has already
 been deleted.

Syntax
------


```js
deleteTexture(texture)
```

### Parameters

`texture`

A `WebGLTexture` object to delete.

### Return value

None (`undefined`).

Examples
--------

### Deleting a texture


```js
const canvas = document.getElementById("canvas");
const gl = canvas.getContext("webgl");
const texture = gl.createTexture();

// …

gl.deleteTexture(texture);
```

Specifications
--------------

| Specification |
| --- |
| WebGL Specification # 5.14.8 |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `WebGLRenderingContext.bindTexture()`
* `WebGLRenderingContext.createTexture()`
* `WebGLRenderingContext.isTexture()`
* `WebGLRenderingContext.texImage2D()`
WebGLRenderingContext: getAttachedShaders() method
==================================================

 The **`WebGLRenderingContext.getAttachedShaders()`** method of
 the WebGL API returns a list of
 `WebGLShader` objects attached to a `WebGLProgram`.

Syntax
------


```js
getAttachedShaders(program)
```

### Parameters

`program`

A `WebGLProgram` object to get attached shaders for.

### Return value

 An `Array` of `WebGLShader` objects that are attached to the
 given `WebGLProgram`.

Examples
--------


```js
const program = gl.createProgram();

// Attach pre-existing shaders
gl.attachShader(program, vertexShader);
gl.attachShader(program, fragmentShader);
gl.linkProgram(program);

gl.getAttachedShaders(program);
```

Specifications
--------------

| Specification |
| --- |
| WebGL Specification # 5.14.9 |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `WebGLRenderingContext.createShader()`
* `WebGLRenderingContext.isShader()`
* `WebGLRenderingContext.deleteShader()`