JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.7.17/fabric.min.js"></script>
<canvas id="c1">
</canvas>
JavaScript
var canvas = new fabric.Canvas('c1');
canvas.setWidth(800);
canvas.setHeight(800);
var canvasHeight = canvas.height;
var canvasWidth = canvas.width;
//Just a debug statement console.log(canvasWidth, canvasHeight);
var bgImg = new fabric.Image();
bgImg.setSrc('http://www.aamcocolorado.com/images/Highway-Traffic.jpg', function () {
bgImg.set({
top: 0,
left: 0,
scaleX: canvasWidth/bgImg.width,
scaleY: canvasHeight/bgImg.height,
});
});
canvas.setBackgroundImage(bgImg);