[Image-SIG] Creating an image from <canvas>'s getImageData() data

[Adam Guthrie]

I'm using <canvas>'s getImageData() function [0] to extract pixel data
from a canvas. The function returns a CanvasPixelArray, which is just
a comma-separated list of all the RGBA pixel values. I then try to
create an image using Image.fromstring as follows:

data = <CanvasPixelArray from getImageData()>
# remove the commas from the string
data = data.replace(',', '')
im = Image.fromstring("RGBA", (80,80), data)
im.save("image.jpg")

This all works fine without any errors. However, the resulting image
is not the same as area that I extracted from the canvas. Here's an
example of the resulting image:
http://img92.imageshack.us/img92/3495/newimagept1.jpg. And here's an
example of the expected image:
http://img92.imageshack.us/img92/2562/graphxy9.jpg.

I can't figure out what I'm doing wrong here. Does the "raw" decoder
accept raw pixel data like this, or does it only like raw image
formats with proper headers, etc. like BMPs. Do I need to write my own
custom decoder?

Thanks,
Adam Guthrie

[0] http://www.whatwg.org/specs/web-apps/current-work/#dom-context-2d-getimagedata