paint.md

well if you want to know the x,y of the pixels in the canvas you can use a loop like the following:

var image = context.getImageData(0, 0, width, height),
    data = image.data;
for( var x = 0; x < width; x++ ) {
  for( var y = 0; y < height; y++) {
    var i = (x*4)+(y*4*image.width);
    data[i] = ..; // I am the red
    data[i+1] = ..; // I am the green
    data[i+2] = ..; // I am the blue
    data[i+3] = ..; // I am the alpha
  }
}

if x/y positioning isn't important you can reduce it to a single loop (same setup as before).

for( var i = 0; i < data.length; i+=4) {
  data[i] = ..; // I am the red
  data[i+1] = ..; // I am the green
  data[i+2] = ..; // I am the blue
  data[i+3] = ..; // I am the alpha
}

then you want to re-paint the image to the canvas.

context.putImageData(image, 0, 0); putImageData is a little expensive however if you are manipulating gradients this seems to be the quickest route I have found.