The HTML5 Canvas Tag

The Canvas Tag

The HTML5 Canvas tag can be used to draw graphics with JavaScript. This is a cool new feature of HTML5, which will not work in older browsers.

Here is a good video to describe how to use this tag:

Another Video that is helpful for this topic can be found here:

The interesting part of the Video starts at minute 8:07.

Some Helpful links regarding the Canvas tag can be found here:

• W3 Schools
• W3 Schools updated
• HTML dot com
• HTML Canvas Tutorials

Special mention of the strokeRect() Method

This will draw a rectangle in a canvas tag with JavaScript

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.strokeRect(20, 20, 150, 100);

The source of this code snippet can be found here.

This is an additional playground for the canvas tag.