O'Reilly logo

Supercharged JavaScript Graphics by Raffaele Cecco

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Chapter 6. HTML5 Canvas

One of HTML5’s most tantalizing features is the Canvas element. Taking the form of a simple rectangular area within the page (similar to a div), Canvas allows you to draw sophisticated graphics inside it using JavaScript. It was initially developed by Apple for rendering user interface widgets and other imagery within the Mac operating system and by the Safari browser. Apple released its patents relating to Canvas under the World Wide Web Consortium’s (W3C) royalty-free licensing terms. This means that Apple provides royalty-free licensing for Canvas when it appears within the context of W3C HTML recommendations.

This chapter covers the basics of Canvas and uses it to implement various practical applications. A fully exhaustive coverage of the tag is beyond the scope of this book, but if this chapter whets your appetite, you may wish to consider the following titles to increase your knowledge:

Canvas is a low-level, immediate mode application programming interface (API):

Low level

Canvas provides a fast but fairly basic feature set. For instance, rectangles are the only native primitive shape. However, you can augment the feature set via JavaScript programming.

Immediate mode

Canvas drawing instructions are executed the moment they are called; unlike SVG, Canvas has no intermediate ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required