JSFiddle - React, Tailwind, and code Playground

by Leonid Artemev

JavaScript

var xhr = new XMLHttpRequest();
xhr.open('GET', 'http://i.imgur.com/sBJOoTm.png', true);

xhr.responseType = 'blob';

var canvas = document.createElement('canvas');
var context = canvas.getContext('2d');
document.body.appendChild(canvas);

xhr.onload = function(e) {
  if (this.status == 200) {
    var blob = this.response;
      var image = new Image();
      image.setAttribute('crossOrigin', 'anonymous');
      image.onload = function(){
          context.drawImage(image,0,0);
          console.log(context.getImageData(10,10,1,1));
      }
      image.src = window.URL.createObjectURL(blob);
     
    //document.getElementById("myImage").src=window.URL.createObjectURL(blob);
  }
};

xhr.onerror = function(e) {
    alert("Error " + e.target.status + " occurred while receiving the document.");
};

xhr.send();