JSFiddle - React, Tailwind, and code Playground

HTML

<html>
<body>
<img src="~/Content/Desert.jpg" alt="Canvas Image" id="imgSampleImage" />
<canvas id="myCanvas" width="400" height="300" style="border:1px solid #000;">
Sorry! your browser does not support Canvas.
</canvas>
 
<script type="text/javascript">
    var canvas = document.getElementById('myCanvas');
    var img = document.getElementById("imgSampleImage");
    var ctx = canvas.getContext('2d');
    ctx.drawImage(img, 0, 0);
    imageData = ctx.getImageData(0, 0, width, height);
    ctx.putImageData(imageData, 0, 0);  
    </script>
</body>
</html>