Canvas Cookbook
eBook - ePub

Canvas Cookbook

  1. 254 pages
  2. English
  3. ePUB (mobile friendly)
  4. Available on iOS & Android
eBook - ePub

About this book

Over 80 simple but creative and structured recipes to explore the capabilities of HTML5 Canvas

About This Book

  • Develop simple to advanced recipes of your own, and ultimately produce a great application
  • Discover a better way to use HTML5 Canvas, JavaScript, and CSS
  • Put your creative instincts to use in your day-to-day interface developments

Who This Book Is For

The book is intended for readers with a preliminary knowledge of JavaScript and CSS. Whether you're a beginner or expert in this technology, the book provides recipes to help you build your own application, presentation, or game.

What You Will Learn

  • Draw basic shapes such as lines, arcs, curves, and text using the coordinate system
  • Learn about the animation cycle and use it to animate shapes
  • Grasp the knowledge required to create particles and use them
  • Give various effects to images and videos and also use them in animations
  • Discover the use of event listeners to make recipes interactive and to handle events through event handlers
  • Create good presentation graphics with graphs and charts
  • Learn all about 3D development, from building 3D objects to animating them
  • Convert your knowledge into a complete working game
  • Understand the interoperability and deployment of recipes on different browsers and on different devices

In Detail

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.

Style and approach

All the recipes are sequential and cover the basic and advanced concepts of Canvas. Every recipe is as simple as possible without compromising creativity

Frequently asked questions

Yes, you can cancel anytime from the Subscription tab in your account settings on the Perlego website. Your subscription will stay active until the end of your current billing period. Learn how to cancel your subscription.
No, books cannot be downloaded as external files, such as PDFs, for use outside of Perlego. However, you can download books within the Perlego app for offline reading on mobile or tablet. Learn more here.
Perlego offers two plans: Essential and Complete
  • Essential is ideal for learners and professionals who enjoy exploring a wide range of subjects. Access the Essential Library with 800,000+ trusted titles and best-sellers across business, personal growth, and the humanities. Includes unlimited reading time and Standard Read Aloud voice.
  • Complete: Perfect for advanced learners and researchers needing full, unrestricted access. Unlock 1.4M+ books across hundreds of subjects, including academic and specialized titles. The Complete Plan also includes advanced features like Premium Read Aloud and Research Assistant.
Both plans are available with monthly, semester, or annual billing cycles.
We are an online textbook subscription service, where you can get access to an entire online library for less than the price of a single book per month. With over 1 million books across 1000+ topics, we’ve got you covered! Learn more here.
Look out for the read-aloud symbol on your next book to see if you can listen to it. The read-aloud tool reads text aloud for you, highlighting the text as it is being read. You can pause it, speed it up and slow it down. Learn more here.
Yes! You can use the Perlego app on both iOS or Android devices to read anytime, anywhere — even offline. Perfect for commutes or when you’re on the go.
Please note we cannot support devices running on iOS 13 and Android 7 or earlier. Learn more about using the app.
Yes, you can access Canvas Cookbook by Bhushan Purushottam Joshi in PDF and/or ePUB format, as well as other popular books in Computer Science & Programming in HTML. We have over one million books available in our catalogue for you to explore.

Information

Canvas Cookbook


Table of Contents

Canvas Cookbook
Credits
About the Author
About the Reviewer
www.PacktPub.com
eBooks, discount offers, and more
Why Subscribe?
Preface
What this book covers
What you need for this book
Who this book is for
Sections
How to do it…
How it works…
There's more…
Conventions
Reader feedback
Customer support
Downloading the example code
Downloading the color images of this book
Errata
Piracy
Questions
1. Paths and Text
Introduction
Drawing lines
How to do it...
How it works...
There's more...
Drawing horizontal, vertical, and assorted lines
How to do it...
How it works...
There's more...
Drawing joins
How to do it...
How it works...
Drawing arc1
How to do it...
How it works...
There's more...
Drawing arc2
How to do it...
How it works...
There's more...
Drawing a quadratic curve
How to do it...
How it works...
There's more...
Drawing a rainbow
How to do it...
How it works...
Drawing a Bezier curve
How to do it...
How it works...
Drawing a flag
How to do it...
How it works...
Drawing text
How to do it...
How it works...
There's more...
Drawing 3D text with shadows
How to do it...
How it works...
There's more...
Adding shadows to objects
How to do it...
How it works...
There's more...
Drawing a house
How to do it...
How it works...
2. Shapes and Composites
Introduction
Drawing rectangles
How to do it…
How it works...
Drawing triangles
How to do it…
How it works...
There's more...
Drawing circles
How to do it…
How it works...
There's more...
Drawing gradients
How to do it…
How it works...
Radial gradient
Linear gradient
There's more...
Working with custom shapes and styles
How to do it…
How it works...
Demonstrating translation, rotation, and scaling
How to do it…
How it works...
There's more...
Drawing an ellipse
How to do it…
How it works...
Saving and restoring canvas state
How to do it…
How it works...
Demonstrating composites
How to do it…
How it works...
Drawing a mouse
How to do it…
How it works...
3. Animation
Introduction
Creating an animation class
Demonstrating acceleration
How to do it…
How it works...
Demonstrating gravity
How to do it…
How it works...
Animating a line
How to do it…
How it works...
There's more...
Animating text
How to do it…
How it works...
There's more...
Animating a clock
How to do it…
How it works...
Animating a solar system
How to do it…
How it works...
Animating particles
How to do it…
How it works...
There's more...
Animating a particle fountain
How to do it…
How it works...
There's more...
Animating a rain effect
How to do it…
How it works...
There's more...
Animating a snow effect
How to do it…
How it works...
There's more...
4. Images and Videos
Introduction
Drawing and cropping an image
How to do it
How it works...
Rendering effects to images
How to do it
How it works...
Drawing a mirror image
How to do it
How it works...
Clipping a path
How to do it
How it works...
Animated clipping
How to do it
How it works...
Converting canvas to image and back to canvas
How to do it
How it works...
Working with videos
How to do it
How it works...
Rendering effects to videos
How to do it
How it works...
Creating a pixelated image focus
How to do it
How it works...
5. Interactivity through Events
Introduction
Working with mouse coordinates
How to do it
How it works...
There's more...
Making a face smile
How to do it
How it works...
There's more...
Detecting a point in a path
How to do it
How it works...
There's more...
Simulating car movements
How to do it
How it works...
There's more...
Dragging and dropping
How to do it
How it works...
Combining events and animation
How to do it
How it works...
There's more...
Demonstrating a touch event
How to do it
How it works...
6. Creating Graphs and Charts
Introduction
Drawing the axes
How to do it…
How it works...
There's more...
Drawing a simple equation
How to do it…
How it works...
There's more...
Drawing a sinusoidal wave
How to do it…
How it works...
Drawing a line graph
How to do it…
How it works...
There's more...
Drawing a bar graph
How to do it…
How it works...
There's more...
Drawing a pie chart
How to do it…
How it works...
There's more...
7. 3D Modeling
Introduction
Rendering 3D objects
How to do it…
How it works...
There's more...
Drawing 3D cubes
How to do it…
How it works...
There's more...
Drawing a 3D cylinder and a cone
How to do it…
How it works...
Drawing a 3D sphere and a torus
How to do it…
How it works...
There's more...
Drawing 3D text decorated by particles
How to do it…
How it works...
There's more...
Drawing a panorama
How to do it…
How it works...
There's more...
Drawing a snowman
How to do it…
How it works...
There's more...
8. Game Development
Introduction
Understanding the gaming states
How to do it…
How it works...
Drawing on canvas
How to do it…
How it works...
There's more...
Playing some music
How to do it…
How it works...
There's more...
Using sprites from the sprite sheet
How to do it…
How it works...
There's more...
Demonstrating animation
How to do it…
How it works...
There's more...
Demonstrating collision
How to do it…
How it works...
There's more...
Demonstrating physics
How to do it…
How it works...
There's more...
Game 1 – Fruit Basket
How to do it…
How it works...
There's more...
Game 2 – Catapult
How to do it…
How it works...
There's more...
9. Interoperability and Deployment
Introduction
Understanding interoperability
Styling text and background using CSS
How to do it
How it works...
There's more...
Deploying a game on Android mobile ...

Table of contents

  1. Canvas Cookbook