Added in HTML5, the HTML
Mozilla applications gained support for
<canvas> starting with Gecko 1.8 (i.e. Firefox 1.5). The element was originally introduced by Apple for the OS X Dashboard and Safari. Internet Explorer supports
<canvas> from version 9 onwards; for earlier versions of IE, a page can effectively add support for
<canvas> by including a script from Google's Explorer Canvas project. Google Chrome and Opera 9 also support
<canvas> element is also used by WebGL to draw hardware-accelerated 3D graphics on web pages.
This is just a simple code snippet which uses the
var canvas = document.getElementById('canvas'); var ctx = canvas.getContext('2d'); ctx.fillStyle = 'green'; ctx.fillRect(10, 10, 100, 100);
Edit the code below and see your changes update live in the canvas:
The interfaces related to the
WebGLRenderingContext are referenced under WebGL.
CanvasCaptureMediaStream is related.
<canvas>and its advanced features.
<canvas>to manipulate video data in real time.
ImageBitmapto directly examine and alter pixels in the canvas's bitmap.
|HTML Living Standard |
The definition of 'the 2D rendering context' in that specification.
© 2005–2018 Mozilla Developer Network and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.