Canvas API
The Canvas module provides an image manipulation API to JavaScript.
Contents
- Overview
- Canvas class
Overview
The Canvas module is a graphics API that is inspired by the
HTML5 canvas, with additional methods to decode from and encode to binary
formats (such as PNG and JPEG), represented by Blobs.
A Gears Canvas is not yet a complete implementation of the HTML5 canvas
specification, and there are two significant differences:
- A Gears Canvas is off-screen, in that creating a Canvas object doesn't
directly paint any pixels on the screen. Furthermore, for technical reasons, a
Gears Canvas is not a DOM Element. On the other hand, you can create a Gears
Canvas in a Worker.
- A Gears Canvas does not implement
getContext, and in particular
does not provide a 2D context.
Permission
This API requires user permission. If you would like to customize the default dialog, you can explicitly call google.gears.factory.getPermission() - see how.
Canvas class
readwrite attribute int height
readwrite attribute int width
void crop(x, y, w, h)
void decode(blob)
Blob encode([mimeType, options])
void resize(w, h, [filter])
Attributes
| Attribute |
Type |
Description |
| height |
readwrite attribute int |
The height of the Canvas. The default value is 150. |
| width |
readwrite attribute int |
The width of the Canvas. The default value is 300. |
Methods
void crop(x, y, w, h) |
| Summary: |
Crops the Canvas. The crop happens "in-place", as opposed
to returning a new Canvas.
|
| Parameters: |
x - The left co-ordinate of the crop rectangle.
y - The top co-ordinate of the crop rectangle.
w - The width of the crop rectangle.
h - The height of the crop rectangle.
|
void decode(blob) |
| Summary: |
Loads an image into this Canvas, replacing the Canvas' current dimensions
and contents.
|
| Parameters: |
blob - The Blob to decode. The image should be in PNG or
JPEG format.
|
| Return value: |
A new Blob containing the specified subset. |
Blob encode([mimeType, options]) |
| Summary: |
Saves the Canvas' contents to a binary format, such as PNG or JPEG.
|
| Parameters: |
mimeType - Optional. The image format to encode to. Valid
values include "image/png" and "image/jpeg". The
default encoding is PNG.
options - Optional. A JavaScript object (i.e. key-value map)
that specifies encoding options. For lossy formats, such as JPEG, one
can specify a "quality" key, whose value should be a number
between 0.0 and 1.0 inclusive.
|
| Return value: |
A new Blob encoding the Canvas' image data. |
void resize(w, h, [filter]) |
| Summary: |
Resizes the Canvas. The resize happens "in-place", as opposed
to returning a new Canvas.
|
| Parameters: |
w - The new width.
h - The new height.
filter - Optional. A string specifying the image filter.
There are two options: "nearest" for nearest-neighbor
filtering, and "bilinear" for bi-linear filtering. The
default filter, if unspecified, is "bilinear".
|
|
