WebGLRenderingContext: canvas property

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

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

js
gl.canvas

Return value

Either a HTMLCanvasElement or OffscreenCanvas object or null.

Examples

Canvas element

Given this <canvas> element:

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

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

js
const canvas = document.getElementById("canvas");
const gl = canvas.getContext("webgl");
gl.canvas; // HTMLCanvasElement

Offscreen canvas

Example using the experimental OffscreenCanvas object.

js
const offscreen = new OffscreenCanvas(256, 256);
const gl = offscreen.getContext("webgl");
gl.canvas; // OffscreenCanvas

Specifications

Specification
WebGL Specification
# DOM-WebGLRenderingContext-canvas

Browser compatibility

BCD tables only load in the browser

See also