Question

var imageData = context.getImageData(0, 0, canvas.width, canvas.height);
var data = imageData.data;

and

var data = context.getImageData(0, 0, canvas.width, canvas.height).data;

they both have different effect, why?

Answer 1

If you’ve changed the code per your comments, i.e. you now have:

var imageData = context.getImageData(0, 0, canvas.width, canvas.height);
var data = context.getImageData(0, 0, canvas.width, canvas.height).data;

then your problem is probably that you’ve now got two separate copies of the image’s pixel data, and the one you’re modifying isn’t then the one that’s copied back.