JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id="canvas" width="320" height="240"></canvas>

CSS

#canvas{
    border: 1px solid black;
}

JavaScript

function draw(){
    var canvas = document.getElementById('canvas');
    var ctx = canvas.getContext('2d');
    var tileWidth = 25;
    var tileWCount = 3;
    var multi = 2;
    var imgA = [];
    var src = [];
    src.push("http://st.hzcdn.com/simgs/6361d7eb0dee6b28_4-1763/contemporary-tile.jpg");
    src.push("http://www.in.all.biz/img/in/catalog/middle/205131.jpeg");
    src.push("http://www.magnet-textures.com/textures/2011/7/715-1259-1-blue-tiles-ico-big.jpg");
    
    for(var i=0; i < tileWCount; i++){
        var img = new Image();
        img.onload = (function(value){
            return function() {
                ctx.drawImage(this, (value * tileWidth * multi), 0, tileWidth * multi, tileWidth * multi);
            }
        })(i);
        img.src = src[i];
    }
}

draw();