HTML5 Canvas

- BlackBerry OS 6.0+
- BlackBerry PlayBook
- Ripple Emulator

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

API Summary

getContext

---

static Object getContext(contextId : String)

Supported Platform(s)

 - BlackBerry OS 6.0+
 - BlackBerry PlayBook
 - Ripple Emulator

Description

Returns an object that exposes an API for drawing on the canvas.

Returns

Returns an object for contextId. Returns null if the given context ID is not supported or if the canvas has already been initialised with some other (incompatible) context type (e.g. trying to get a "2d" context after getting a "webgl" context).

Parameter	Type	Description
contextId	String	Specifies the desired API. List of defined contexts: 2d, webgl.

Code Example(s)

<script type="text/javascript">
  var c=document.getElementById("myCanvas");
  var cxt=c.getContext("2d");
  cxt.fillStyle="#FF0000";
  cxt.fillRect(0,0,150,75);
</script>

toDataURL

---

static String toDataURL([type: String])

Supported Platform(s)

 - BlackBerry OS 6.0+
 - BlackBerry PlayBook
 - Ripple Emulator

Description

Returns a data:URL for the image in the canvas.

Returns

When called with no arguments, returns a data:URL containing a representation of the image as a PNG file. If the canvas has no pixels (i.e. either its horizontal dimension or its vertical dimension is zero) then the method must return the string "data:,". When the method is called with one arguments, it must return a data:URL containing a representation of the image in the format given by type. The possible values are MIME types with no parameters, for example image/png, image/jpeg, or even maybe image/svg+xml if the implementation actually keeps enough information to reliably render an SVG image from the canvas.

Parameter	Type	Description
type	String Optional	The argument, if provided, controls the type of the image to be returned (e.g. PNG or JPEG). The default is image/png; that type is also used if the given type isn't supported.

Code Example(s)

<script>
  var img1=new Image();
  img1.src="Image1.jpeg";
  var canvas=document.createElement('canvas');
  canvas.width=300;
  canvas.height=300;
  var canvas2d=canvas.getContext("2d");
  canvas2d.drawImage(img1,100,100);
  window.location = canvas.toDataURL("image/png");
</script>

<canvas id=mycanvas width=200 height=200></canvas>
<script>
  var canvas = document.getElementById("mycanvas"); 
  var context = canvas.getContext("2d"); 
  var img = canvas.toDataURL(); 
  document.write('<img src="'+img+'"/>');
</script>

Properties:

---

Property	Type	Description	Supported Platform(s)
height	Static pixels	Specifies the height of the canvas. The default value of height is 150 pixels. Whenever the height or width of a canvas is re-set the canvas content will be cleared. Syntax : <canvas height="value">	- BlackBerry OS 6.0+  - BlackBerry PlayBook  - Ripple Emulator
width	Static pixels	Specifies the width of the canvas. The default value of width is 300 pixels. Whenever the height or width of a canvas is re-set the canvas content will be cleared. Syntax : <canvas width="value">	- BlackBerry OS 6.0+  - BlackBerry PlayBook  - Ripple Emulator

Code Example(s)

<canvas id="myCanvas" width="200" height="100"></canvas>

Documentation generated by JsDoc Toolkit 2.4.0 on Sun Dec 30 2012 13:31:16 GMT-0500 (EST)