14. HTML5: Introduction to canvas

With every experience, you alone are painting your own canvas, thought by thought, choice by choice.

—Oprah Winfrey

Observe Everything. Communicate Well. Draw, Draw, Draw.

—Frank Thomas

Do not go where the path may lead, go instead where there is no path and leave a trail.

—Ralph Waldo Emerson


In this chapter you’ll:

• Draw lines, rectangles, arcs, circles, ellipses and text.

• Draw gradients and shadows.

• Draw images, create patterns and convert a color image to black and white.

• Draw Bezier and quadratic curves.

• Rotate, scale and transform.

• Dynamically resize a canvas to fill the window.

• Use alpha transparency and compositing techniques.

• Create an HTML5 canvas-based game app with sound ...

Get Internet & World Wide Web: How to Program, Fifth Edition now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.