Html5 Canvas Cheat Sheet Page 2
ADVERTISEMENT
1
2Colors, styles and shadows
Text
Attributes
Attributes
Name
Type
Default
Name
Type
Default
strokeStyle
any
black
font
string
10px sans-serif
fillStyle
any
black
textAlign
string
start
Supports any of the following values:
shadowOffsetX
float
0.0
[start, end, left, right, center]
shadowOffsetY
float
0.0
textBaseline
string
alphabetic
shadowBlur
float
0.0
Supports any of the following values:
shadowColor
string
transparent black
[top, hanging, middle, alphabetic, ideographic, bottom]
Methods
Methods
Return
Name
Return
Name
CanvasGradient
createLinearGradient(
fillText(
void
float x0, float y0, float x1, float y1)
string text, float x, float y,
CanvasGradient
createRadialGradient(
[Optional] float maxWidth)
float x0, float y0, float r0,
void
strokeText(
float x1, float y1, float r1)
string text, float x, float y,
CanvasPattern
createPattern(
[Optional] float maxWidth)
Object image, string repetition)
TextMetrics
measureText( string text)
Argument "image" can be of type HTMLImageElement,
HTMLCanvasElement or HTMLVideoElement
TextMetrics interface
"repetition" supports any of the following values:
width
float
[readonly]
[repeat (default), repeat-x, repeat-y, no-repeat]
CanvasGradient interface
Rectangles
addColorStop(
void
Methods
float offset, string color)
Return
Name
CanvasPattern interface
void
clearRect(
No attributes or methods.
float x, float y, float w, float h)
void
fillRect(
Paths
float x, float y, float w, float h)
void
strokeRect(
Methods
float x, float y, float w, float h)
Return
Name
Pixel manipulation
void
beginPath( )
void
closePath( )
Methods
void
fill( )
void
stroke( )
Return
Name
void
clip( )
ImageData
createImageData( float sw, float sh)
void
moveTo( float x, float y)
createImageData( ImageData
ImageData
void
lineTo( float x, float y)
imagedata)
void
quadraticCurveTo(
ImageData
getImageData(
float cpx, float cpy,
float sx, float sy, float sw, float sh)
float x, float y )
void
putImageData(
void
bezierCurveTo(
ImageData imagedata,
float cp1x, float cp1y,
float dx, float dy,
float cp2x, float cp2y,
[Optional] float dirtyX, float dirtyY,
float x, float y )
float dirtyWidth, float dirtyHeight)
void
arcTo(
ImageData interface
float x1, float y1,
float x2, float y2, float radius )
width
unsigned long
[readonly]
arc(
void
height
unsigned long
[readonly]
float x, float y, float radius,
data
CanvasPixelArray
[readonly]
float startAngle, float endAngle,
CanvasPixelArray interface
boolean anticlockwise )
void
rect( float x, float y, float w, float h)
length
unsigned long
[readonly]
boolean
isPointInPath( float x, float y)
Source: (2009-05-04)
ADVERTISEMENT
0 votes
Related Articles
Related forms
Related Categories
Parent category: Education