var img=new Image();
img.crossOrigin='anonymous';
img.onload=start;
img.src="https://istack.dev59.com/EUBBt.webp";
function start(){
var croppedURL=cropPlusExport(img,190,127,93,125);
var cropImg=new Image();
cropImg.src=croppedURL;
document.body.appendChild(cropImg);
}
function cropPlusExport(img,cropX,cropY,cropWidth,cropHeight){
var canvas1=document.createElement('canvas');
var ctx1=canvas1.getContext('2d');
canvas1.width=cropWidth;
canvas1.height=cropHeight;
ctx1.drawImage(img,cropX,cropY,cropWidth,cropHeight,0,0,cropWidth,cropHeight);
return(canvas1.toDataURL());
}
body{ background-color: ivory; }
img{border:1px solid red; margin:0 auto; }
<h4>Original image</h4>
<img src='https://istack.dev59.com/EUBBt.webp'>
<h4>Cropped image create from cropping .toDataURL</h4>