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
The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Feature | Chrome | Firefox | Edge | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|---|
Basic Support | 9 | 4.0 | 12 | 11 | 12 | 5.1 |
OffscreenCanvas | (No) | 44.01 | (No) | (No) | (No) | (No) |
Feature | Android | Chrome for Android | Edge mobile | Firefox for Android | IE mobile | Opera Android | iOS Safari |
---|---|---|---|---|---|---|---|
Basic Support | (Yes) | 25 | (Yes) | (Yes) | 11 | 12 | 8.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.