This section focuses on the fundamental drawing capabilities of the HTML5 Canvas, including line and curve drawing, path drawing, shape drawing, gradients, images, text, shadows, and composites.
<canvas> was first introduced by Apple for the Mac OS X Dashboard and later implemented in Safari and Google Chrome. Gecko 1.8-based browsers, such as Firefox 1.5, also support this element. The <canvas> element is part of the WhatWG Web applications 1.0 specification also known as HTML 5.
In this tutorial I will try to describe how to implement the <canvas> element in your own HTML pages. The examples provided should give you some clear ideas what you can do with <canvas> and can be used to start building your own implementations.
In this 7-minute video tutorial on HTML5 Canvas, you’ll learn how to create complex curves using the canvas.
One of the most talked about features of the upcoming HTML5 code is the <canvas> element / tag, some of you may be aware that the <canvas> was first developed by Apple for use in their Mac OS X Dashboard and also implemented at a later date by the Safari browser, Most Gecko based browsers such as FireFox have current support for the <canvas> tag.
“Canvas” which is an HTML5 tag, allows you to render graphics or visual images on the fly through programming in a browser. Very similar to generating graphics (drawing shapes) in Flash using the BitmapData class. To implement canvas in your webpage, you need to define a “canvas” tag in your mark up just like how you define any other container tag like “div”.
9. HTML 5 Canvas Tutorial - How to Use the HTML 5 Tag CANVAS