Last Updated: February 25, 2016
·
25.84K
· luin

Get the pixel data of an image in HTML

function getPixel(url, x, y) {
  var img = new Image();
  img.src = url;
  var canvas = document.createElement('canvas');
  var context = canvas.getContext('2d');
  context.drawImage(img, 0, 0);
  return context.getImageData(x, y, 1, 1).data;
}


getPixel('./bg.png', 10, 10); // [255, 255, 255, 0];