Game Development Reference
In-Depth Information
// Insert pixel data into canvas context
ctx.putImageData(pixels, 0, 0);
};
img.src = "img/html5-logo.png";
Manipulating an image is no more complex than performing various calculations on each pixel of the
pixel buffer that represents an image.
Finally, the way we can export the image from a canvas is as simple as calling the
toDataURL
function. Make a special note that this function is called on the canvas
object, and not on the rendering context object. The
toDataURL
function of the can-
vas object takes two optional parameters, namely, a string representing the MIME
type of the output image, and a
float
between
0.0
and
1.0
, representing the qual-
ity of the output image. If the output image type is anything other than
"image/
jpeg"
, the quality parameter is ignored.
