HTML5 Canvas Fundamentals
The HTML5 Canvas Fundamentals course provides an in-depth look at working with the HTML5 Canvas and shows how it can be used to display data, animate shapes, and perform many other useful functions.
What you'll learn
The HTML5 Canvas provides a powerful way to render graphics, charts, and other types of visual data without relying on plugins such as Flash or Silverlight. In this course you’ll be introduced to key features available in the canvas API and see how they can be used to render shapes, text, video, images, and more. You’ll also learn how to work with gradients, perform animations, transform shapes, and build a custom charting application from scratch. If you're looking to learn more about using the HTML5 Canvas in your Web applications then this course will break down the learning curve and give you a great start!
Table of contents
- Introduction 1m
- Drawing Rectangles and Ellipses 6m
- Demo: Simple Bar Chart 12m
- Demo: Simple Bar Chart with Transforms 7m
- Demo: Drawing Circles 8m
- Demo: Using arcTo() 5m
- Drawing Lines and Paths 5m
- Demo: Drawing Lines 6m
- Demo: Simple Line Chart 4m
- Demo: Using bezierCurveTo() 3m
- Demo: Using quadraticCurveTo() 3m
- Drawing Text 1m
- Demo: Filling, Stroking, and MeasuringText 4m
- Demo: Using Canvas Transforms with Text 6m
- Drawing Images 2m
- Demo: Using Image Functions 10m
- Drawing Video 1m
- Demo: Syncing Video with a Canvas 5m
- Summary 1m
- Introduction 1m
- Rendering Gradients 5m
- Demo: Creating Linear Gradients 4m
- Demo: Creating Radial Gradients 5m
- Using Transforms 8m
- Demo: Getting Started with Transform Functions 5m
- Demo: Using transform() and setTransform() 5m
- Accessing Pixels 8m
- Demo: Creating Pixels Dynamically 9m
- Demo: Grayscale Pixels 5m
- Animation Fundamentals 6m
- Demo: Getting Started with Animation 6m
- Demo: Using Gradients, Transforms, and Animations 8m
- Summary 1m
About the author
Dan Wahlin founded Wahlin Consulting, which provides consulting and training services on JavaScript, Angular, Node.js, C#, ASP.NET MVC, Web API, Docker, and Kubernetes. He is a Google GDE (and former Microsoft MVP and Regional Director), Docker Captain, and speaks at conferences and user groups around the world. Dan is active on Twitter (@DanWahlin), blogs at https://blog.codewithdan.com, and adds a lot of code to his Github repos at https://github.com/danwahlin.