Chapter 4. Mastering Transformations
In this chapter, we will cover:
- Translating the canvas context
- Rotating the canvas context
- Scaling the canvas context
- Creating a mirror transform
- Creating custom transforms
- Shearing the canvas context
- Handling multiple transforms with the state stack
- Transforming a circle into an oval
- Rotating an image
- Drawing a simple logo and randomizing its position, rotation, and scale
Introduction
This chapter will reveal the power of canvas transformations, which can drastically simplify complex drawings and provide new functionality that we wouldn't have had otherwise. Until now, we've been positioning elements on the screen directly with x and y coordinates. This can quickly become a problem if you've worked out the coordinates ...
Get HTML5 Canvas Cookbook 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.
