JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id="mycanvas" width="2480" height="3508"></canvas>

CSS

canvas {
                border: #666 1px solid;
                border-width: thick;
            }

JavaScript

var temp_can1, temp_can1_ctx;
$(document).ready(function () {
    temp_can1 = document.getElementById('mycanvas');
    temp_can1_ctx = temp_can1.getContext('2d');
    var imageObj_rotator3 = new Image();

    imageObj_rotator3.onload = function () {

        temp_can1_ctx.drawImage(imageObj_rotator3, 0, 0);
        temp_can1_ctx.globalCompositeOperation = "source-atop";
        var pattern = temp_can1_ctx.createPattern(imageObj_rotator3, 'no-repeat');
        temp_can1_ctx.rect(0, 0, temp_can1.width, temp_can1.height);
        temp_can1_ctx.fillStyle = pattern;
        temp_can1_ctx.fill();
        temp_can1_ctx.globalAlpha = 0.10;
        temp_can1_ctx.drawImage(imageObj_rotator3, 1, 0);
        temp_can1_ctx.drawImage(imageObj_rotator3, 0, 1);
        temp_can1_ctx.drawImage(imageObj_rotator3, 0, 0);

    };
    imageObj_rotator3.src = 'http://i.stack.imgur.com/yknNo.jpg';

});