I'd like to know if there is a way to dynamically modify/access the data contained in html images just as if they were an html5 canvas element. With canvas, you can in javascript access the raw pixel data with getImageData() and putImageData(), but I have thus far been not able to figure out how to do this with images.
views:
1059answers:
4
A:
Im not sure if it is possible, but you can try requesting pixel information from PHP, if GD library it will be an easy task, but surely will be slower. Since you didnt specified application so I will suggest checking SVG for this task if they can be vector images than you will be able to query or modify the image.
Cem Kalyoncu
2009-09-18 17:32:29
I wanted to do this entirely in the browser, not use any server side scripting at all.
gmiernicki
2009-09-22 21:44:40
Can you give some details, its pretty impossible to do it but there might be alternative solutions.
Cem Kalyoncu
2009-09-23 07:23:38
if i were to actually implement this in some software, i would probably update the DOM node of the image. However, my question was aimed more at the level of "is this even possible?" to learn more about html itself.
gmiernicki
2009-09-23 18:34:02
+2
A:
You could draw the image to a canvas element with drawImage(), and then get the pixel data from the canvas.
Alex Barrett
2009-09-18 17:34:43
This does not allow me to put manipulate the image data itself tho, which is what I want to do.
gmiernicki
2009-09-22 21:44:03
Once the image has been copied to the `canvas` element, you can manipulate it any way you would normally manipulate `canvas` pixel data.
Alex Barrett
2009-10-13 00:00:15
A:
"The getImageData(sx, sy, sw, sh) method must return an ImageData object representing the underlying pixel data for the area of the canvas denoted by the rectangle whose corners are the four points (sx, sy), (sx+sw, sy), (sx+sw, sy+sh), (sx, sy+sh), in canvas coordinate space units. Pixels outside the canvas must be returned as transparent black. Pixels must be returned as non-premultiplied alpha values."
^^it's quotes from http://dev.w3.org/html5/spec/the-canvas-element.html#dom-context-2d-getimagedata so it's must return but sometimes it's not, and why not make "new image" to have content ImageData, so to copy CanvasPixelArray to another ImageData without rendering on canvas ?!
someguy
2009-11-26 21:10:14
A:
Getting image data from image(not canvas) is something I have also been looking for. I can send it from the server-side(php) but the problem is - I don't want to handle things like compression of this image data(without which it would be huge compared to an image file). I basically want to apply some filters on a image before putting it on the canvas. To do this I need to access image data before sending it on to the canvas. Anyone has any ideas on this ?
anonymous
2010-04-11 17:19:10