HTML5 2D Canvas Context

The 2D context represents a flat Cartesian surface whose origin (0,0) is at the top left corner, with the coordinate space having x values increasing when going right, and y values increasing when going down.


Supported Platform(s)

- BlackBerry OS 6.0+
- BlackBerry PlayBook 1.0+
- BlackBerry 10
- Ripple Emulator
View Supported Platform Table
APIBB5.0BB6.0BB7.0PB1.0PB2.0BB10Ripple
canvas.getContext('2d')   Y Y Y Y YY
arc   Y Y Y Y YY
arcTo   Y Y Y Y YY
beginPath   Y Y Y Y YY
bezierCurveTo   Y Y Y Y YY
caretBlinkRate   Y Y Y Y Y 
clearRect   Y Y Y Y YY
clip   Y Y Y Y YY
closePath   Y Y Y Y YY
createImageData   Y Y Y Y YY
createImageData   Y Y Y Y YY
createLinearGradient   Y Y Y Y YY
createPattern   Y Y Y Y YY
createRadialGradient   Y Y Y Y YY
drawFocusRing   Y Y Y Y Y 
drawImage   Y Y Y Y YY
drawImage   Y Y Y Y YY
fill   Y Y Y Y YY
fillRect   Y Y Y Y YY
fillText   Y Y Y Y YY
getImageData   Y Y Y Y YY
isPointInPath   Y Y Y Y YY
lineTo   Y Y Y Y YY
measureText   Y Y Y Y YY
moveTo   Y Y Y Y YY
putImageData   Y Y Y Y YY
quadraticCurveTo   Y Y Y Y YY
rect   Y Y Y Y YY
restore   Y Y Y Y YY
rotate   Y Y Y Y YY
save   Y Y Y Y YY
scale   Y Y Y Y YY
setCaretSelectionRect   Y Y Y Y Y 
setTransform   Y Y Y Y YY
stroke   Y Y Y Y YY
strokeRect   Y Y Y Y YY
strokeText   Y Y Y Y YY
transform   Y Y Y Y YY
translate   Y Y Y Y YY
canvas   Y Y Y Y YY
fillStyle   Y Y Y Y YY
font   Y Y Y Y YY
globalAlpha   Y Y Y Y YY
globalCompositeOperation   Y Y Y Y YY
lineCap   Y Y Y Y YY
lineJoin   Y Y Y Y YY
lineWidth   Y Y Y Y YY
miterLimit   Y Y Y Y YY
shadowBlur   Y Y Y Y YY
shadowColor   Y Y Y Y YY
shadowOffsetX   Y Y Y Y YY
shadowOffsetY   Y Y Y Y YY
strokeStyle   Y Y Y Y YY
textAlign   Y Y Y Y YY
textBaseline   Y Y Y Y YY

Configuration Document Settings

To use all of the API described for this object, you must ensure the following settings are in your configuration document:

This API does not require a <feature> element to be declared in the configuration document of your BlackBerry WebWorks Application.

Permission Elements (PlayBook and BlackBerry 10+)
This API does not require a <permission> element to be declared in the configuration document of your BlackBerry WebWorks Application.

Constructors

canvas.getContext('2d')

Functions

void arc
void arcTo
void beginPath
void bezierCurveTo
Number caretBlinkRate
void clearRect
void clip
void closePath
ImageData createImageData
ImageData createImageData
CanvasGradient createLinearGradient
CanvasPattern createPattern
CanvasGradient createRadialGradient
Boolean drawFocusRing
void drawImage
void drawImage
void fill
void fillRect
void fillText
ImageData getImageData
Boolean isPointInPath
void lineTo
TextMetrics measureText
void moveTo
void putImageData
void quadraticCurveTo
void rect
void restore
void rotate
void save
void scale
Boolean setCaretSelectionRect
void setTransform
void stroke
void strokeRect
void strokeText
void transform
void translate

Properties

canvas canvas
Object fillStyle
String font
Number globalAlpha
String globalCompositeOperation
String lineCap
String lineJoin
Number lineWidth
Number miterLimit
Number shadowBlur
String shadowColor
Number shadowOffsetX
Number shadowOffsetY
Object strokeStyle
String textAlign
String textBaseline

Constructors

canvas.getContext('2d')


to create an CanvasRenderingContext2D object you must fetch the context of a Canvas using the '2d' identifier


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Code Example: 
<html>
<head>
    <title>Example</title>
    <script type="text/javascript">
        function foo()
        {
                var canvas = document.getElementById("myCanvas")
                var context = canvas.getContext('2d');      
                
                // Draw a pink triangle  
                context.beginPath();              
                context.lineWidth="3";
                context.strokeStyle="magenta";
                context.fillStyle="pink";
                context.moveTo(150,0);
                context.lineTo(300,200);
                context.lineTo(0,200);
                context.closePath();
                context.fill();
                context.stroke();
        }
    </script>
    </head>
    <body onload="foo();">
        <canvas id="myCanvas" width="300" height="300"></canvas>
    </body>
</html>

Functions

void arc (x : Number, y : Number, radius : Number, startAngle : Number, endAngle : Number, anticlockwise : Boolean)


Adds points to the subpath such that the arc described by the circumference of the circle described by the arguments—starting at the given start angle, ending at the given end angle, and going in the given direction—is added to the path, connected to the previous point by a straight line.

If the given radius is negative, throws an INDEX_SIZE_ERR exception.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
x x-coord of the start point
y y-coord of the start point
radius radius of the arc
startAngle start angle in radians
endAngle end angle in radians
anticlockwise if true draw the arc anti-clockwise

Throws
INDEX_SIZE_ERR If the given radius is negative.

void arcTo (x1 : Number, y1 : Number, x2 : Number, y2 : Number, radius : Number)


Adds a point to the current path, connected to the previous one by a straight line, then adds a second point to the current path, connected to the previous one by an arc whose properties are described by the arguments.

If the given radius is negative, throws an INDEX_SIZE_ERR exception .


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
x1 x-coord of the start point
y1 y-coord of the start point
x2 x-coord of the end point
y2 y-coord of the end point
radius radius of the arc

Throws
INDEX_SIZE_ERR If the given radius is negative.

void beginPath ()


Resets the current path.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator

void bezierCurveTo (cp1x : Number, cp1y : Number, cp2x : Number, cp2y : Number, x : Number, y : Number)


Adds the given point to the current path, connected to the previous one by a cubic Bézier curve with the given control points.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
cp1x x-coord of the first intermediate control point describing the curve
cp1y y-coord of the first intermediate control point describing the curve
cp2x x-coord of the second intermediate control point describing the curve
cp2y y-coord of the second intermediate control point describing the curve
x x-coord of the end point
y y-coord of the end point

Number caretBlinkRate ()


Returns the blink rate of the system in milliseconds if supported. Otherwise, returns -1 if it is unsupported by the system.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10


Return:

blinkrate in milliseconds. -1 if unsupported.


void clearRect (x : Number, y : Number, w : Number, h : Number)


Clears all pixels on the canvas in the given rectangle to transparent black.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
x x-coord of the rectangle
y y-coord of the rectangle
w width of the rectangle
h height of the rectangle

void clip ()


Further constrains the clipping region to the given path.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator

void closePath ()


Marks the current subpath as closed, and starts a new subpath with a point the same as the start and end of the newly closed subpath.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator

ImageData createImageData (sw : Number, sh : Number)


Returns an ImageData object with the given dimensions in CSS pixels (which might map to a different number of actual device pixels exposed by the object itself). All the pixels in the returned object are transparent black.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
sw width of the image data object to create
sh height of the image data object to create

Return:

The ImageData for the current context


ImageData createImageData (imagedata : ImageData)


Returns an ImageData object with the same dimensions as the argument. All the pixels in the returned object are transparent black.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
imagedata The ImageData to copy

Throws
NOT_SUPPORTED_ERR If the argument is null

Return:

The ImageData for the current context


CanvasGradient createLinearGradient (x0 : Number, y0 : Number, x1 : Number, y1 : Number)


Returns a CanvasGradient object that represents a linear gradient that paints along the line given by the coordinates represented by the arguments.

If x0 = x1 and y0 = y1, then the linear gradient will paint nothing.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
x0 x-coord of the start point
y0 y-coord of the start point
x1 x-coord of the end point
y1 y-coord of the end point

Throws
NOT_SUPPORTED_ERR If any of the arguments are not finite numbers.

Return:

The created CanvasGradient


CanvasPattern createPattern (image : HTMLImageElement|HTMLCanvasElement|HTMLVideoElement, repetition : String)


Returns a CanvasPattern object that uses the given image and repeats in the direction(s) given by the repetition argument.

The allowed values for repetition are "repeat" (both directions), "repeat-x" (horizontal only), "repeat-y" (vertical only), and "no-repeat" (neither). If the repetition argument is empty or null, the value repeat is used.

If the first argument is not an img, canvas interface element, or video element, throws a TYPE_MISMATCH_ERR exception.

If the image is not fully decoded yet or has no image data, throws an INVALID_STATE_ERR exception.

If the second argument is not one of the allowed values a SYNTAX_ERR exception.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
image
repetition

Throws
TYPE_MISMATCH_ERR If the first argument isn't an img, canvas, or video element.
INVALID_STATE_ERR If the image has no image data.
SYNTAX_ERR If the second argument isn't one of the allowed values.

Return:

The created CanvasPattern


CanvasGradient createRadialGradient (x0 : Number, y0 : Number, r0 : Number, x1 : Number, y1 : Number, r1 : Number)


Returns a CanvasGradient object that represents a radial gradient that paints along the cone given by the circles represented by the arguments.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
x0 x-coord of the start circle
y0 y-coord of the start circle
r0 radius of the start circle
x1 x-coord of the end circle
y1 y-oord of the end circle
r1 radius of the end circle

Throws
NOT_SUPPORTED_ERR If any of the arguments are not finite numbers.
INDEX_SIZE_ERR If either of the radii are negative.

Return:

The created CanvasGradient


Boolean drawFocusRing (element : Element, [canDrawCustom : Boolean])


If the given element is focused or a descendant of the element with focus, draws a focus ring around the current path, following the platform conventions for focus rings.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10


Parameters
element check if the given element is focused
canDrawCustom If true, then the focus ring is only drawn if the user has configured his system to draw focus rings in a particular manner. (For example, high contrast focus rings.)

Return:

When the method returns true, the author is expected to manually draw a focus ring


void drawImage (image : HTMLImageElement|HTMLCanvasElement|HTMLVideoElement, sx : Number, sy : Number, sw : Number, sh : Number, dx : Number, dy : Number, dw : Number, dh : Number)


Draw the given image onto the canvas.

The source rectangle is the rectangle whose corners are the four points (sx, sy), (sx+sw, sy), (sx+sw, sy+sh), (sx, sy+sh).

The destination rectangle is the rectangle whose corners are the four points (dx, dy), (dx+dw, dy), (dx+dw, dy+dh), (dx, dy+dh).

If not specified, the dw and dh arguments must default to the values of sw and sh, interpreted such that one CSS pixel in the image is treated as one unit in the canvas coordinate space. If the sx, sy, sw, and sh arguments are omitted, they must default to 0, 0, the image's intrinsic width in image pixels, and the image's intrinsic height in image pixels, respectively.

drawImage.png


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
image the source image
sx x-coord of the source position
sy y-coord of the source position
sw width of the source position
sh height of the source position
dx x-coord of the destination position
dy y-coord of the destination position
dw width of the destination position
dh height of the destination position

void drawImage (image : HTMLImageElement|HTMLCanvasElement|HTMLVideoElement, dx : Number, dy : Number, [dw : Number], [dh : Number])


Draw the given image onto the canvas.

drawImage.png


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
image the source image
dx x-coord of the destination position
dy y-coord of the destination position
dw width of the destination position
dh height of the destination position

void fill ()


Fills the subpaths with the current fill style.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator

void fillRect (x : Number, y : Number, w : Number, h : Number)


Paints the given rectangle onto the canvas, using the current fill style.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
x x-coord of the rectangle
y y-coord of the rectangle
w width of the rectangle
h height of the rectangle

void fillText (text : String, x : Number, y : Number, [maxWidth : Number])


Renders fill for the given text at the given position. If a maximum width is provided, the text is scaled to fit that width if necessary.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
text the text to fill
x the x-coord of where the text is placed
y the y-coord of where the text is placed
maxWidth The maximum width the text should take up

ImageData getImageData (sx : Number, sy : Number, sw : Number, sh : Number)


Returns an ImageData object containing the image data for the given rectangle of the canvas.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
sx x-coord of the source position
sy y-coord of the source position
sw width of the source position
sh height of the source position

Throws
INDEX_SIZE_ERR If the either of the width or height arguments are zero.
NOT_SUPPORTED_ERR If the argument is null

Return:

The ImageData


Boolean isPointInPath (x : Number, y : Number)


Returns true if the given point is in the current path.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
x x-coord of the point to check
y y-coord of the point to check

Return:

true if point x,y is in the path, otherwise false


void lineTo (x : Number, y : Number)


Adds the given point to the current subpath, connected to the previous point by a straight line.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
x x-coord of the end point to draw a line to
y y-coord of the end point to draw a line to

TextMetrics measureText (text : String)


Returns a TextMetrics object with the metrics of the given text in the current font.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
text the text string to measure

Return:

the width of the text if rendered


void moveTo (x : Number, y : Number)


Creates a new subpath with the given point as its first (and only) point.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
x x-coord of the point to move to
y y-coord of the point to move to

void putImageData (imagedata : ImageData, dx : Number, dy : Number, [dirtyX : Number], [dirtyY : Number], [dirtyWith : Number], [dirtyHeight : Number])


Paints the data from the given ImageData object onto the canvas. If a dirty rectangle is provided, only the pixels from that rectangle are painted.

The globalAlpha and globalCompositeOperation attributes, as well as the shadow attributes, are ignored for the purposes of this method call; pixels in the canvas are replaced wholesale, with no composition, alpha blending, no shadows, etc.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
imagedata The ImageData to copy
dx x-coord of the destination position
dy y-coord of the destination position
dirtyX x-coord of the source position
dirtyY y-coord of the source position
dirtyWith width of the source position
dirtyHeight height of the source position

Throws
TYPE_MISMATCH_ERR If the first argument is null
NOT_SUPPORTED_ERR If any of the other arguments are not finite.

void quadraticCurveTo (cpx : Number, cpy : Number, x : Number, y : Number)


Adds the given point to the current path, connected to the previous one by a quadratic Bézier curve with the given control point.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
cpx x-coord of the intermediate control point describing the curve
cpy y-coord of the intermediate control point describing the curve
x x-coord of the end point
y y-coord of the end point

void rect (x : Number, y : Number, w : Number, h : Number)


Adds a new closed subpath to the path, representing the given rectangle.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
x x-coord of the rectangle
y y-coord of the rectangle
w width of the rectangle
h height of the rectangle

void restore ()


Pop the top entry in the drawing state stack, and reset the drawing state it describes.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator

void rotate (angle : Number)


Add the rotation transformation described by the argument to the transformation matrix. The angle argument represents a clockwise rotation angle expressed in radians.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
angle clockwise rotation angle expressed in radians

void save ()


Push a copy of the current drawing state onto the drawing state stack.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator

void scale (x : Number, y : Number)


Add the scaling transformation described by the arguments to the transformation matrix. The x argument represents the scale factor in the horizontal direction and the y argument represents the scale factor in the vertical direction. The factors are multiples.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
x the amount to scale horizontally
y the amount to scale vertically

Boolean setCaretSelectionRect (element : Element, x : Number, y : Number, w : Number, h : Number)


Returns true if the given element is focused or a document descendant of an element with focus. Otherwise, returns false.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10


Parameters
element
x x-coord of the selection position
y y-coord of the selection position
w width of the selection position
h height of the selection position

Return:

true if the given element is focused or a document descendant of an element with focus. Otherwise, returns false


void setTransform (m11 : Number, m12 : Number, m21 : Number, m22 : Number, dx : Number, dy : Number)


Reset the current transform to the identity matrix (it should not change the image). To transform the image, invoke the transform(m11, m12, m21, m22, dx, dy) method with the appropriate arguments.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
m11 Is the (1,1) parameter of of the transformation matrix
m12 Is the (1,2) parameter of of the transformation matrix
m21 Is the (2,1) parameter of of the transformation matrix
m22 Is the (2,2) parameter of of the transformation matrix
dx Is the x-scalar of the transformation matrix
dy Is the y-scalar of the transformation matrix

void stroke ()


Creates the strokes of the subpaths with the current stroke style.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator

void strokeRect (x : Number, y : Number, w : Number, h : Number)


Paints the box that outlines the given rectangle onto the canvas, using the current stroke style.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
x x-coord of the rectangle
y y-coord of the rectangle
w width of the rectangle
h height of the rectangle

void strokeText (text : String, x : Number, y : Number, [maxWidth : Number])


Renders strokes for the given text at the given position. If a maximum width is provided, the text is scaled to fit that width if necessary.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
text
x the x-coord of where the text is placed
y the y-coord of where the text is placed
maxWidth The maximum width the text should take up

void transform (m11 : Number, m12 : Number, m21 : Number, m22 : Number, dx : Number, dy : Number)


Method must replace the current transformation matrix with the result of multiplying the current transformation matrix with the matrix described by:

m11m21dx
m12m22dy
001


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
m11 Is the (1,1) parameter of of the transformation matrix
m12 Is the (1,2) parameter of of the transformation matrix
m21 Is the (2,1) parameter of of the transformation matrix
m22 Is the (2,2) parameter of of the transformation matrix
dx Is the x-scalar of the transformation matrix
dy Is the y-scalar of the transformation matrix

void translate (x : Number, y : Number)


Add the translation transformation described by the arguments to the transformation matrix. The x argument represents the translation distance in the horizontal direction and the y argument represents the translation distance in the vertical direction. The arguments are in coordinate space units.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator


Parameters
x x-coord of the translation
y y-coord of the translation

Properties

readonly canvas canvas


Return the canvas interface element that the context paints on.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator

Object fillStyle


The current style used for filling shapes.
Can be set, to change the fill style.
The style can be either a string containing a CSS color, or a CanvasGradient or CanvasPattern object. Invalid values are ignored.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator

String font


The current font settings.
Can be set, to change the font. The syntax is the same as for the CSS 'font' property; values that cannot be parsed as CSS font values are ignored.
Relative keywords and lengths are computed relative to the font of the canvas interface element.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator

Number globalAlpha


The current alpha value applied to rendering operations. Can be set, to change the alpha value. Values outside of the range from 0.0 to 1.0 are ignored.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator

String globalCompositeOperation


The current composition operation, from the list below. Can be set, to change the composition operation. Unknown values are ignored.

  • "copy":
    A (B is ignored). Display the source image instead of the destination image.
  • "destination-atop":
    B atop A. Display the destination image wherever both images are opaque. Display the source image wherever the source image is opaque but the destination image is transparent. Display transparency elsewhere.
  • "destination-in":
    B in A. Display the destination image wherever both the destination image and source image are opaque. Display transparency elsewhere.
  • "destination-out":
    B out A. Display the destination image wherever the destination image is opaque and the source image is transparent. Display transparency elsewhere.
  • "destination-over":
    B over A. Display the destination image wherever the destination image is opaque. Display the source image elsewhere.
  • "lighter":
    A plus B. Display the sum of the source image and destination image, with color values approaching 1 as a limit.
  • "source-atop":
    A atop B. Display the source image wherever both images are opaque. Display the destination image wherever the destination image is opaque but the source image is transparent. Display transparency elsewhere.
  • "source-in":
    A in B. Display the source image wherever both the source image and destination image are opaque. Display transparency elsewhere.
  • "source-out":
    A out B. Display the source image wherever the source image is opaque and the destination image is transparent. Display transparency elsewhere.
  • "source-over" (default):
    A over B. Display the source image wherever the source image is opaque. Display the destination image elsewhere.
  • "vendorName-operationName":
    Vendor-specific extensions to the list of composition operators should use this syntax.
  • "xor":
    A xor B. Exclusive OR of the source image and destination image.


These values are all case-sensitive and must be used exactly as shown. User agents must not recognize values that are not a case-sensitive match for one of the values given above.

The operators in the previous list must be treated as described by the Porter-Duff operator given at the start of their description (e.g. A over B).

On setting, if the user agent does not recognize the specified value, the value must be ignored, leaving the value of globalCompositeOperation unaffected.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator

String lineCap


The current line cap style.
Can be set, to change the line cap style.
The possible line cap styles are "butt", "round", and "square".
Other values are ignored.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator

String lineJoin


Returns the current line join style.
Can be set, to change the line join style.
The possible line join styles are "miter", "round", and "bevel".
Other values are ignored.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator

Number lineWidth


The current line width.
Can be set, to change the line width.
Values that are not finite values greater than zero are ignored.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator

Number miterLimit


The current miter limit ratio.
Can be set, to change the miter limit ratio.
Values that are not finite values greater than zero are ignored.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator

Number shadowBlur


The current level of blur applied to shadows.
Can be set, to change the blur level. Values that are not finite numbers greater than or equal to zero are ignored.

The units do not map to coordinate space units and are not affected by the current transformation matrix.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator

String shadowColor


Returns the current shadow color.
Can be set, to change the shadow color. Values that cannot be parsed as CSS colors are ignored.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator

Number shadowOffsetX


The current shadow offset.
Can be set, to change the shadow offset. Values that are not finite numbers are ignored.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator

Number shadowOffsetY


The current shadow offset.
Can be set, to change the shadow offset. Values that are not finite numbers are ignored.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator

Object strokeStyle


The current style used for the stroke of the shapes.
Can be set, to change the stroke style.
The style can be either a string containing a CSS color, or a CanvasGradient or CanvasPattern object.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator

String textAlign


The current text alignment settings.
Can be set, to change the alignment. The possible values are "start", "end", "left", "right", and "center". The default is "start".
Other values are ignored.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator

String textBaseline


The current baseline alignment settings.
Can be set, to change the baseline alignment. The possible values are "top", "hanging", "middle", "alphabetic", "ideographic", and "bottom". The default is "alphabetic". Other values are ignored.


Supported Platforms
 - BlackBerry OS 6.0+
 - BlackBerry PlayBook 1.0+
 - BlackBerry 10
 - Ripple Emulator

Documentation generated by JsDoc Toolkit 2.4.0 on Sun Dec 30 2012 18:15:34 GMT-0500 (EST)