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

1. To access the WebGL context, use experimental-webgl rather than the standard webgl

2. This feature is experimentally implemented since Firefox 44; to activate it, in about:config, set gfx.offscreencanvas.enabled to true

See also

• CanvasRenderingContext2D.canvas
• OffscreenCanvas