- 1.1. The canvas Element
- 1.2. Canvas Contexts
- 1.3. Canonical Examples in This Book
- 1.4. Getting Started
- 1.5. Fundamental Drawing Operations
- 1.6. Event Handling
- 1.7. Saving and Restoring the Drawing Surface
- 1.8. Using HTML Elements in a Canvas
- 1.9. Printing a Canvas
- 1.10. Offscreen Canvases
- 1.11. A Brief Math Primer
- 1.12. Conclusion
This chapter is from the book
This chapter is from the book
This chapter is from the book
1.3. Canonical Examples in This Book
Many of the examples in this book use the following canonical form:
<!-- example.html --><!DOCTYPEhtml><html><head><title>Canonical Canvas used in this book</title><style>...#canvas{...}</style></head><body><canvasid='canvas'width='600'height='300'>Canvas not supported</canvas><scriptsrc='example.js'></script></body></html>// example.jsvarcanvas=document.getElementById('canvas'),context=canvas.getContext('2d');// Use the context...
The preceding example has one canvas whose ID is canvas, and it uses one JavaScript file named example.js. That JavaScript file has two variables, one for the canvas and another for the canvas’s context. The preceding example uses document.getElementById() to obtain a reference to the canvas and gets a reference to the canvas’s context.
Most applications in this book that adhere to the preceding canonical form omit the HTML listings in the interests of brevity. Likewise, for inline code listings, meaning listings like the preceding listing that do not have an Example heading, you will often see the variables canvas and context with no code showing their initialization.
Finally, again in the interests of brevity, not every example in the book is fully listed. Often examples in the book build upon one other, and when they do, you will often see the full listing for the last example and partial listings for the other related examples.
NOTE: A word about User Agents
The Canvas specification refers to the implementor of the canvas element as a User Agent, which is often abbreviated to UA. The specification uses that term instead of the word browser because canvas elements can be implemented by any piece of software, not just browsers.
This book refers to the implementor of the canvas element as a browser because the term User Agent, or worse, the abbreviation UA, can be foreign and confusing to readers.
NOTE: URLs referenced in this book
In this book you will occasionally find references to URLs for further reading. Sometimes, if they are readable and not too long, those URLs will be the actual URLs. For unwieldy URLs, this book refers to shortened URLs that may be difficult to remember but are easy to type.