JSFiddle - React, Tailwind, and code Playground
by Ea Bangalore
HTML
<br/><p>Original was 1600x1200, reduced to 400x300 canvas</p><br/>
<canvas id="canvas" width=100 height=100></canvas>
CSS
body{ background-color: ivory; }
canvas{border:1px solid red;}
JavaScript
var canvas=document.getElementById("canvas");
var ctx=canvas.getContext("2d");
img=new Image();
img.onload=function(){
canvas.width=400;
canvas.height=300;
ctx.drawImage(img,0,0,img.width,img.height,0,0,400,300);
}
img.src="https://placehold.jp/1028x900.png";