HTML and CSS Reference
In-Depth Information
case 107:
if (currentScale>maxScale){
currentScale = maxScale;
When testing Example 4-15 , use the arrow keys to pan across the photo, and the +
and - keys to zoom in and out.
Pixel Manipulation
In this section, we will first examine the Canvas Pixel Manipulation API, and then build
a simple application demonstrating how to manipulate pixels on the canvas in real time.
The Canvas Pixel Manipulation API
The Canvas Pixel Manipulation API gives us the ability to “get,” “put,” and “change”
individual pixels utilizing what is known as the CanvasPixelArray interface. ImageData
is the base object type for this manipulation, and an instance of this object is created
with the createImageData() function call. Let's start there.
The createImageData() function sets aside a portion of memory to store individual
pixels' worth of data based on the following three constructors:
imagedata = context. createImageData (sw, sh)
The sw and sh parameters represent the width and height values for the Image
Data object. For example, imagedata=createImageData(100,100) would create a
100×100 area of memory in which to store pixel data.
imagedata = context. createImageData (imagedata)
The imagedata parameter represents a separate instance of ImageData . This con-
structor creates a new ImageData object with the same width and height as the
parameter ImageData .
imagedata = context. createImageData ()
This constructor returns a blank ImageData instance.
ImageData attributes
An ImageData object contains three attributes:
This returns the height in pixels of the ImageData instance.
This returns the width in pixels of the ImageData instance.
Search WWH ::

Custom Search