Book Image

Canvas Cookbook

Book Image

Canvas Cookbook

Overview of this book

With the growing popularity of HTML5 Canvas, this book offers tailored recipes to help you develop portable applications, presentations, and games. The recipes are simple yet creative and build on each other. At every step, the book inspires the reader to develop his/her own recipe. From basic to advanced, every aspect of Canvas API has been covered to guide readers to develop their own application, presentation, or game.
Table of Contents (16 chapters)
Canvas Cookbook
Credits
About the Author
About the Reviewer
www.PacktPub.com
Preface
Index

Saving and restoring canvas state


This recipe is based on the concept of stack. You can imagine a stack of books. Say, for example, I have to pick up a book from a stack of three books. It's always logical and easy to pick up the top-most book, read it, and keep it aside. Then I pick another book from the two-book stack, read it, and keep it aside. Then I pick the last book, read it, and keep it aside.

States of canvas work in a similar way. Let's see the output of the recipe:

How to do it…

The recipe for the previous output goes like this.

The HTML code:

<html>
<head>
<title>Canvas Save And Restore</title>
<script src="CanvasSaveRestore.js"></script>
</head>
<body onload="CanvasSaveRestore()">
<canvas id="MyCanvasArea" width="500" height="200" style="border:2px solid blue;" >
   your browser does not support canvas
</canvas>
<h1>Canvas Save And Restore</h1>
</body>
</html>

The JavaScript code:

function CanvasSaveRestore...