HTML5 getImageData without canvas

Is there a way to use getImageData images without a canvas? I want to get the pixel color at the mouse position of the image.

+5
source share
1 answer

No, you can’t.

But getting imageData can be done using a canvas in memory, which is quick and easy:

var canvas = document.createElement('canvas');
var context = canvas.getContext('2d');
var img = document.getElementById('someImageId');
context.drawImage(img, 0, 0 );
var theData = context.getImageData(0, 0, img.width, img.height);

You can save the variable theDataso you don't have to create it every time you click.

Please note that this will not work if the image comes from another domain (and therefore, it will not work if you open your html file using file://instead http://).

+7
source

All Articles