WebGLRenderingContext.canvas

The WebGLRenderingContext.canvas property is a read-only reference to the HTMLCanvasElement or OffscreenCanvas object that is associated with the context. It might be null if it is not associated with a <canvas> element or an OffscreenCanvas object.

Syntax

gl.canvas;

Return value

Either a HTMLCanvasElement or OffscreenCanvas object or null.

Examples

Canvas element

Given this <canvas> element:

<canvas id="canvas"></canvas>

You can get back a reference to it from the WebGLRenderingContext using the canvas property:

var canvas = document.getElementById('canvas');
var gl = canvas.getContext('webgl');
gl.canvas; // HTMLCanvasElement

Offscreen canvas

Example using the experimental OffscreenCanvas object.

var offscreen = new OffscreenCanvas(256, 256);
var gl = offscreen.getContext('webgl');
gl.canvas; // OffscreenCanvas

Specifications

Specification Status Comment
WebGL 1.0
The definition of 'WebGLRenderingContext.canvas' in that specification.
Recommendation Initial definition.

Browser compatibility

FeatureChromeFirefoxEdgeInternet ExplorerOperaSafari
Basic Support94.01211125.1
OffscreenCanvas(No)44.01(No)(No)(No)(No)
FeatureAndroidChrome for AndroidEdge mobileFirefox for AndroidIE mobileOpera AndroidiOS Safari
Basic Support(Yes)25(Yes)(Yes)11128.1
OffscreenCanvas(No)(No)(No)(No)(No)(No)(No)

1. From version 44.0, this feature is behind the gfx.offscreencanvas.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.

See also

Document Tags and Contributors

 Contributors to this page: fscholz, nmve, teoli
 Last updated by: fscholz,