Setting and using colors and styles


show more Setting and using colors and styles provides you with in-depth training on Developer. Taught by Joe Marini as part of the HTML5: Graphics and Animation with Canvas show less
please wait ...

Setting and using colors and styles

One of the most basic things that you need to set when you're going to draw on the canvas is usually involving some kind of color and style, and the canvas 2D drawing context provides some global properties that affect how objects are stroked and filled. And there are three properties. The first is the fillStyle. That's the style to use when filling a shape. And you can set this to anything that you would normally set a CSS color property to. So, for example, you can use a CSS color or a gradient or a pattern, and this defaults to black if you don't set it.

We'll take a look at gradients and patterns later. We'll focus on colors for now. In addition to the fillStyle, there is a strokeStyle. And again this is the same idea. You can set this to a color or gradient or a pattern, and also defaults to black, and this is the color or style that's you used when strokes are drawn, usually lines or outlines on objects that have an area. And then there is the lineWidth proper...

Setting and using colors and styles
Video duration: 3m 19s 3h 7m Intermediate

Viewers:

Setting and using colors and styles provides you with in-depth training on Developer. Taught by Joe Marini as part of the HTML5: Graphics and Animation with Canvas

Subjects:
Developer Web
Software:
HTML
Author:
please wait ...