Canvas API: Learn how to create graphics for your website with HTML5 and JavaScript

JD Gauchat

Jan 2018 · J.D Gauchat

About this ebook

 Learn how to create graphic applications for the Web with the Canvas API. After reading this guide, you will know how to create graphics for the web, how to manipulate images, and how to generate animations and small video games.

Table of Contents

CANVAS API

Graphics

The Canvas

The Context

Drawing

Rectangles

Colors

Gradients

Paths

Lines

Text

Shadows

Transformations

Status

The GlobalCompositeOperation Property

Images

Patterns

Image Data

Cross-Origin

Extracting Data

Animations

Simple Animations

Professional Animations

Video

Real-Life Application

QUICK REFERENCE

Canvas

Lines

Text

Shadows

Transformations

Images

This guide assumes that you have a basic knowledge of HTML, CSS and JavaScript, and you know how to create files and upload them to a server. If you don't know how to program in HTML, CSS or JavaScript, you can download our guides Introduction to HTML, Introduction to CSS, and Introduction to JavaScript. For a complete course on web development, read our book HTML5 for Masterminds.

This guide is a collection of excerpts from the book HTML5 for Masterminds. The information included in this guide will help you understand a particular aspect of web development, but it will not teach you everything you need to know to develop a website or a web application. If you need a complete course on web development, read our book HTML5 for Masterminds. For more information, visit our website at www.formasterminds.com.