Join Joe Marini for an in-depth discussion in this video Compositing and globalAlpha, part of Learning HTML Canvas.
- [Instructor] In addition to transforms,…the canvas provides different compositing methods…and a global alpha setting.…And that's the opacity setting…that affects all of the drawing operations…that happen on the canvas.…The global alpha is a value from zero to one,…where one is full opacity,…and zero is fully transparent.…And we'll see more examples of that in a moment.…There's also a setting for…the default compositing method.…And that affects how new content…that is drawn onto the canvas surface…is affected by the content that's already there.…
So there are 12 different compositing methods,…and I've listed them all here.…The first is called source-over,…and this is the default compositing method…for the canvas.…Basically what that means is every time…you draw something new,…it gets drawn on top of what's already there,…which is pretty much the behavior…you would expect.…Each time you draw a new shape,…you just expect it to appear on the canvas…on top of everything that came before it.…The next one is source-in.…
- Canvas examples
- Drawing shapes, arcs, paths, and curves
- Drawing text
- Drawing shadows, patterns, and gradients
- Using clipping paths
- Displaying images and video
- Transforming objects with scaling and rotation
- Manipulating raw pixels
- Applying transitions
- Creating animations
Skill Level Intermediate
1. Overview of Canvas
2. Basic Canvas Drawing Techniques
3. Complex Canvas Drawing
4. Advanced Drawing APIs
5. Practical Examples
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.