Html5 Canvas Cheat Sheet

ADVERTISEMENT

HTML5 Canvas Cheat Sheet
v1.1
Canvas element
Compositing
Attributes
Attributes
Name
Type
Default
Name
Type
Default
width
unsigned long
300
globalAlpha
float
1.0
height
unsigned long
150
globalCompositeOperation
string
source-over
Methods
Supports any of the following values:
Return
Name
toDataURL(
string
[Optional] string type,
[Variadic] any args)
Object
getContext( string contextId)
source-over
source-in
source-out
2D Context
Attributes
Name
Type
canvas
HTMLCanvasObject [readonly]
source-atop
destination-over destination-in
Methods
Return
Name
save( )
void
void
restore( )
destination-out destination-atop
lighter
Transformation
Methods
Return
Name
void
scale( float x, float y)
void
rotate( float angle)
copy
xor
void
translate( float x, float y)
void
transform(
Line styles
float m11, float m12,
float m21, float m22,
Attributes
float dx, float dy)
Name
Type
Default
void
setTransform(
float m11, float m12,
lineWidth
float
1.0
float m21, float m22,
lineCap
string
butt
float dx, float dy)
Supports any of the following values:
butt
round
square
Image drawing
Methods
Return
Name
drawImage(
void
lineJoin
string
miter
Object image,
Supports any of the following values:
float dx, float dy,
round
bevel
miter
[Optional] float dw, float dh)
Argument "image" can be of type HTMLImageElement,
HTMLCanvasElement or HTMLVideoElement
void
drawImage(
Object image,
miterLimit
float
10
float sx, float sy, float sw, float sh,
float dx, float dy, float dw, float dh)

ADVERTISEMENT

00 votes

Related Articles

Related forms

Related Categories

Parent category: Education
Go
Page of 2