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
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
Basic support | 9 | 4.0 (2.0) | 11 | 12 | 5.1 |
OffscreenCanvas | Not supported | 44 (44) [1] | Not supported | Not supported | Not supported |
Feature | Android | Chrome for Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|
Basic support | (Yes) | 25 | (Yes) | (Yes) | 12 | 8.1 |
OffscreenCanvas | Not supported | 44 (44) [1] | Not supported | Not supported | Not supported | Not supported |
[1] This feature is behind a feature preference setting. In about:config, set gfx.offscreencanvas.enabled to true.