JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.5.0/fabric.min.js"></script>
<canvas id="c" width="400" height="400" style="border:1px solid #ccc"></canvas>
JavaScript
var canvas = new fabric.Canvas('c');
ctx = canvas.getContext('2d');
/*ctx.fillRect(20,20,150,100);
ctx.globalCompositeOperation = 'source-atop';
ctx.fillStyle = '#ff0000';
ctx.fillRect(30,30,150,100);*/
fabric.Image.fromURL('http://fabricjs.com/assets/2.svg', function(img){
console.log(img._element)
img1 = img;
fabric.Image.fromURL('http://fabricjs.com/assets/pug.jpg', function(img){
ctx.globalCompositeOperation = 'destination-atop';
ctx.drawImage(img._element, 0, 0, 500, 500);
ctx.drawImage(img1._element, 0, 0, 500, 500);
/*img1.scaleToWidth(canvas.getWidth());
img2 = img;
img2.scaleToHeight(300);
img2.left = 50;
img2.top = 50;
img2.globalCompositeOperation = 'source-atop';
canvas.add(img1);
canvas.add(img2);*/
});
});