JSFiddle - React, Tailwind, and code Playground

HTML

<div style="background-color:#3399ff;">
    == Image Resize &amp; Rotate Test ==
    <br>src: (Same-Origin Only)
    <br><img id="img_src" src="http://fiddle.jshell.net/img/logo-white.png" />
    <br>dst: rotate 90
    <br><img id="img_dst_r90" src="" />
    <br>dst: rotate 180
    <br><img id="img_dst_r180" src="" />
    <br>dst: rotate 270
    <br><img id="img_dst_r270" src="" />
</div>
<!--
** ATTENTION **
canvas.toDataURL is affected by Cross-Domain Restrictions (Same-Origin Policy)
-->

JavaScript

window.onload = function() {
    // Source Image
    var img_src = document.getElementById('img_src');
    // Destination Image Rotate 90
    document.getElementById('img_dst_r90').src = ImageResize(img_src, "image/png", 200, 150, 90);
    // Destination Image Rotate 180
    document.getElementById('img_dst_r180').src = ImageResize(img_src, "image/png", 200, 150, 180);
    // Destination Image Rotate 270
    document.getElementById('img_dst_r270').src = ImageResize(img_src, "image/png", 200, 150, 270);
}
//========================================================
// ImageResize
// Params
//   image     : HTMLImageElement | Source Image Element
//   mime_type : string | Source Image MIME Type
//   width     : number | Destination Image Width
//   height    : number | Destination Image Height
//   rotate    : number | Destination Image Rotate 0/90/180/270 only
// Return
//   string | Base64 Image Data
//========================================================
function ImageResize(image_src, mime_type, width, height, rotate) {
    // New Canvas
    var canvas = document.createElement('canvas');
    if(rotate == 90 || rotate == 270) {
        // swap w <==> h
        canvas.width = height;
        canvas.height = width;
    } else {
        canvas.width = width;
        canvas.height = height;
    }
    // Draw (Resize)
    var ctx = canvas.getContext('2d');
    if(rotate && rotate > 0) {
        ctx.rotate(rotate * Math.PI / 180);
        if(rotate == 90)
            ctx.translate(0, -height);
        else if(rotate == 180)
            ctx.translate(-width, -height);
        else if(rotate == 270)
            ctx.translate(-width, 0);
    }
    ctx.drawImage(image_src, 0, 0, width, height);
    // Image Base64
    return canvas.toDataURL(mime_type);
}