Canvas 2D Context
Glossary
A
alpha
A value used in the transparent imaging model to control a pixel's degree of opacity. The range of alpha values is [0.0. .1.0]: an alpha value of 1.0 denotes complete opacity, an alpha value of 0.0 implies absolute transparency.
alpha channel
The array of alpha values within an image.
animation
Sequential drawing operations creating the illusion of motion. Canvas 2D context API does not have intrinsic attributes and methods related to animation, so scripted animations should be created by means of external JavaScript APIs.
axial shading
Color blending varying across a linear axis. An example of the axial shading in the canvas 2D context is a linear gradient used to fill a graphic object drawn on the canvas.
B
backdrop
The previously existing contents of the canvas with which a new object is composited.
bit depth
The number of bits used to store per-pixel color data: for example, bit depth of 8 produces 256 colors; 24-bit depth allows the system to display 16777216 individual colors. Working with image data in the canvas 2D context implies the use of the bit depth equal to 32: 32 bits per pixel (bpp) are 24 bits describing red, green and blue color components with 8 bits allocated for an alpha value.
bitmap
A rectangular array of bits. The canvas bitmap uses 32 bpp.
blending
Mixing colors in the areas where shapes overlap. Practically, blending results in reducing two color components to one. Blending precedes the compositing step: first the color mix of a graphic object and the backdrop is calculated, then the resulting color is composited with the backdrop in accordance with a Porter - Duff compositing rule.
C
Cartesian coordinates
Coordinates written as a pair of numbers. The numbers are the x and y coordinate values, respectively.
channel
Per-pixel information of a particular kind within an image. Red, green, blue and alpha channels are used to describe color information of the image data.
clipping
Applying a clipping path to eliminate part of a shape outside the path. A clipping path can be viewed as a 1-bit "hard mask": pixels outside the clipping path are set to transparent black and masked out; pixels inside the clipping path are allowed to show through.
compositing
Merging a current graphic object with the backdrop according to a certain compositing rule.
constructive area geometry
Creating new graphic objects by performing Boolean operations on existing ones. An example of applying Boolean logic to the construction of arbitrary shapes on the canvas plane is the use of the XOR compositing operator.
control point
A point influencing the shape of a curve.
coordinate system
A flat Cartesian surface with the origin at the top left corner. In the canvas coordinate system x values are increasing rightwards, and y values are increasing when going down.
current transformation matrix
Accumulation of all transformations that have been defined on the canvas. The matrix maps device-independent canvas space coordinates into output device coordinates.
E
EM square
Design grid on which the glyph outlines are defined.
F
flat shading
Painting a graphic object with a single color across its extent.
filling
Painting the interior enclosed by the current path. To fill a path, a single color, a gradient (linear or radial) or a pattern can be used.
font
Dataset containing glyph descriptions as well as other information enabling the system to display glyphs.
G
glyph
A graphical representation of a character.
I
image
A rectangular array of pixels. In the canvas 2D context raw image data is initialized to a Uint8ClampedArray object.
image smoothing
A way to control rendering quality: the user agent applies a smoothing algorithm to the image data or a pattern fill when the system does not have exactly one device pixel corresponding to one coordinate space unit in the canvas bitmap.
L
line
A path of a certain length between two endpoints.
line cap
Shape used at the endpoint of a stroked path.
line dash pattern
A binary pattern of dashes and gaps used to stroke a path. A dash pattern is specified in terms of a dash array and a dash phase. The dash array defines the lengths of alternating dashes and gaps; such length are expressed in canvas space coordinates. The dash phase is the offset into the dash pattern indicating where to start the dash.
line join
Shape used at the corners of stroked paths.
M
masking
Painting a graphic object onto the background through a mask.
miter limit
Maximum imposed on the ratio of the miter length to the line width. Miter limit is applied when two line segments with the miter line join meet at a sharp angle.
P
path
A sequence of connected straight and curved segments (subpaths). Each segment is a geometric primitive - a line, an arc, a rectangle or a curve.
pattern cell
A small graphical figure replicated to fill the interior of a shape.
pixel
A single grid point of an image. A pixel has associated sample values from all channels.
primitive
A geometric shape that can be drawn as a discrete entity.
R
radial shading
Color blending varying between two circles. An example of the radial shading in the canvas 2D context is a radial gradient used to fill the interior of a path.
rendering
Displaying a graphic object on a raster output device.
S
sample
Intersection of a channel and a pixel in an image.
stroking
Painting a line along the contour of a path.
T
transformation
Establishing a new current coordinate system.
transformation matrix
Matrix specifying the relationship between two coordinate spaces.
