Core HTML5 Canvas: Graphics, Animation, and Game Development [NOOK Book]


One of HTML5’s most exciting features, Canvas provides a powerful 2D graphics API that lets you implement everything from word processors to video games. In Core HTML5 Canvas , best-selling author David Geary presents a code-fueled, no-nonsense deep dive into that API, covering everything you need to know to implement rich and consistent web applications that run on a wide variety of operating systems and devices.


Succinctly and clearly written, this book examines dozens ...

See more details below
Core HTML5 Canvas: Graphics, Animation, and Game Development

Available on NOOK devices and apps  
  • NOOK Devices
  • Samsung Galaxy Tab 4 NOOK 7.0
  • Samsung Galaxy Tab 4 NOOK 10.1
  • NOOK HD Tablet
  • NOOK HD+ Tablet
  • NOOK eReaders
  • NOOK Color
  • NOOK Tablet
  • Tablet/Phone
  • NOOK for Windows 8 Tablet
  • NOOK for iOS
  • NOOK for Android
  • NOOK Kids for iPad
  • PC/Mac
  • NOOK for Windows 8
  • NOOK for PC
  • NOOK for Mac

Want a NOOK? Explore Now

NOOK Book (eBook)
$27.49 price
(Save 42%)$47.99 List Price


One of HTML5’s most exciting features, Canvas provides a powerful 2D graphics API that lets you implement everything from word processors to video games. In Core HTML5 Canvas , best-selling author David Geary presents a code-fueled, no-nonsense deep dive into that API, covering everything you need to know to implement rich and consistent web applications that run on a wide variety of operating systems and devices.


Succinctly and clearly written, this book examines dozens of real-world uses of the Canvas API, such as interactively drawing and manipulating shapes, saving and restoring the drawing surface to temporarily draw shapes and text, and implementing text controls. You’ll see how to keep your applications responsive with web workers when you filter images, how to implement smooth animations, and how to create layered, 3D scrolling backgrounds with parallax. In addition, you’ll see how to implement video games with extensive coverage of sprites, physics, collision detection, and the implementation of a game engine and an industrial-strength pinball game. The book concludes by showing you how to implement Canvas-based controls that you can use in any HTML5 application and how to use Canvas on mobile devices, including iOS5. This authoritative Canvas reference covers 

  • The canvas element—using it with other HTML elements, handling events, printing a canvas, and using offscreen canvases
  • Shapes—drawing, dragging, erasing, and editing lines, arcs, circles, curves, and polygons; using shadows, gradients, and patterns
  • Text—drawing, positioning, setting font properties; building text controls
  • Images—drawing, scaling, clipping, processing, and animating
  • Animations—creating smooth, efficient, and portable animations
  • Sprites—implementing animated objects that have painters and behaviors
  • Physics—modeling physical systems (falling bodies, pendulums, and projectiles), and implementing tweening for nonlinear motion and animation
  • Collision detection—advanced techniques, clearly explained
  • Game development—all aspects of game development, such as time-based motion and high score support, implemented in a game engine
  • Custom controls—infrastructure for implementing custom controls; implementing progress bars, sliders, and an image panner
  • Mobile applications—fitting Canvas apps on a mobile screen, using media queries, handling touch events, and specifying iOS5 artifacts, such as app icons 

Throughout the book, Geary discusses high-quality, reusable code to help professional developers learn everything they really need to know, with no unnecessary verbiage. All of the book’s code and live demonstrations of key techniques are available at

Read More Show Less

Product Details

  • ISBN-13: 9780132761666
  • Publisher: Pearson Education
  • Publication date: 5/28/2012
  • Series: Core Series
  • Sold by: Barnes & Noble
  • Format: eBook
  • Edition number: 1
  • Pages: 752
  • File size: 108 MB
  • Note: This product may take a few minutes to download.

Meet the Author

David Geary is a prominent author, speaker, and consultant who teaches developers how to implement web applications. He wrote the best-selling books on both Java component frameworks: Graphic Java 2: Swing, Third Edition (Prentice Hall, 1999), and (with Cay Horstmann) Core JavaServer™ Faces, Third Edition (Prentice Hall, 2010). David is a prolific speaker who is a three-time JavaOne rock star. In 2011, David co-founded the HTML5 Denver meetup group.

Read More Show Less

Table of Contents

Preface xv

Acknowledgments xxiii

About the Author xxv


Chapter 1: Essentials 1

1.1 The canvas Element 1

1.2 Canvas Contexts 8

1.3 Canonical Examples in This Book 12

1.4 Getting Started 14

1.5 Fundamental Drawing Operations 22

1.6 Event Handling 26

1.7 Saving and Restoring the Drawing Surface 33

1.8 Using HTML Elements in a Canvas 36

1.9 Printing a Canvas 46

1.10 Offscreen Canvases 51

1.11 A Brief Math Primer 53

1.12 Conclusion 64


Chapter 2: Drawing 65

2.1 The Coordinate System 67

2.2 The Drawing Model 68

2.3 Drawing Rectangles 70

2.4 Colors and Transparency 72

2.5 Gradients and Patterns 76

2.6 Shadows 83

2.7 Paths, Stroking, and Filling 88

2.8 Lines 103

2.9 Arcs and Circles 124

2.10 Bézier Curves 137

2.11 Polygons 144

2.12 Advanced Path Manipulation 150

2.13 Transformations 170

2.14 Compositing 181

2.15 The Clipping Region 187

2.16 Conclusion 198


Chapter 3: Text 201

3.1 Stroking and Filling Text 202

3.2 Setting Font Properties 207

3.3 Positioning Text 210

3.4 Implementing Text Controls 225

3.5 Conclusion 252


Chapter 4: Images and Video 253

4.1 Drawing Images 254

4.2 Scaling Images 259

4.3 Drawing a Canvas into a Canvas 266

4.4 Offscreen Canvases 270

4.5 Manipulating Images 274

4.6 Clipping Images 302

4.7 Animating Images 306

4.8 Security 312

4.9 Performance 313

4.10 A Magnifying Glass 321

4.11 Video Processing 328

4.12 Conclusion 337


Chapter 5: Animation 339

5.1 The Animation Loop 340

5.2 Calculating Frame Rates 358

5.3 Scheduling Tasks at Alternate Frame Rates 359

5.4 Restoring the Background 360

5.5 Double Buffering 364

5.6 Time-Based Motion 367

5.7 Scrolling the Background 370

5.8 Parallax 377

5.9 User Gestures 383

5.10 Timed Animations 385

5.11 Animation Best Practices 390

5.12 Conclusion 391


Chapter 6: Sprites 393

6.1 Sprites Overview 394

6.2 Painters 398

6.3 Sprite Behaviors 411

6.4 Sprite Animators 417

6.5 A Sprite-Based Animation Loop 424

6.6 Conclusion 425


Chapter 7: Physics 427

7.1 Gravity 428

7.2 Warping Time 450

7.3 Time-Warp Functions 456

7.4 Warping Motion 458

7.5 Warping Animation 473

7.6 Conclusion 482


Chapter 8: Collision Detection 483

8.1 Bounding Areas 483

8.2 Bouncing Off Walls 488

8.3 Ray Casting 490

8.4 The Separating Axis Theorem (SAT) and Minimum Translation Vector (MTV) 495

8.5 Conclusion 541


Chapter 9: Game Development 543

9.1 A Game Engine 544

9.2 The Ungame 572

9.3 A Pinball Game 589

9.4 Conclusion 614


Chapter 10: Custom Controls 615

10.1 Rounded Rectangles 617

10.2 Progress Bars 625

10.3 Sliders 631

10.4 An Image Panner 643

10.5 Conclusion 655


Chapter 11: Mobile 657

11.1 The Mobile Viewport 659

11.2 Media Queries 666

11.3 Touch Events 671

11.4 iOS5 677

11.5 A Virtual Keyboard 682

11.6 Conclusion 701


Index 703

Read More Show Less

Customer Reviews

Be the first to write a review
( 0 )
Rating Distribution

5 Star


4 Star


3 Star


2 Star


1 Star


Your Rating:

Your Name: Create a Pen Name or

Barnes & Review Rules

Our reader reviews allow you to share your comments on titles you liked, or didn't, with others. By submitting an online review, you are representing to Barnes & that all information contained in your review is original and accurate in all respects, and that the submission of such content by you and the posting of such content by Barnes & does not and will not violate the rights of any third party. Please follow the rules below to help ensure that your review can be posted.

Reviews by Our Customers Under the Age of 13

We highly value and respect everyone's opinion concerning the titles we offer. However, we cannot allow persons under the age of 13 to have accounts at or to post customer reviews. Please see our Terms of Use for more details.

What to exclude from your review:

Please do not write about reviews, commentary, or information posted on the product page. If you see any errors in the information on the product page, please send us an email.

Reviews should not contain any of the following:

  • - HTML tags, profanity, obscenities, vulgarities, or comments that defame anyone
  • - Time-sensitive information such as tour dates, signings, lectures, etc.
  • - Single-word reviews. Other people will read your review to discover why you liked or didn't like the title. Be descriptive.
  • - Comments focusing on the author or that may ruin the ending for others
  • - Phone numbers, addresses, URLs
  • - Pricing and availability information or alternative ordering information
  • - Advertisements or commercial solicitation


  • - By submitting a review, you grant to Barnes & and its sublicensees the royalty-free, perpetual, irrevocable right and license to use the review in accordance with the Barnes & Terms of Use.
  • - Barnes & reserves the right not to post any review -- particularly those that do not follow the terms and conditions of these Rules. Barnes & also reserves the right to remove any review at any time without notice.
  • - See Terms of Use for other conditions and disclaimers.
Search for Products You'd Like to Recommend

Recommend other products that relate to your review. Just search for them below and share!

Create a Pen Name

Your Pen Name is your unique identity on It will appear on the reviews you write and other website activities. Your Pen Name cannot be edited, changed or deleted once submitted.

Your Pen Name can be any combination of alphanumeric characters (plus - and _), and must be at least two characters long.

Continue Anonymously

    If you find inappropriate content, please report it to Barnes & Noble
    Why is this product inappropriate?
    Comments (optional)