JSFiddle - React, Tailwind, and code Playground

by mkdizajn

HTML

<body>
<canvas id="canvas" width="800" height="600" style="border:1px solid #d3d3d3; position: absolute;">
Your browser does not support the canvas element.
</canvas>
</body>

JavaScript

fabric.Object.prototype.objectCaching = false;

var canvas = new fabric.Canvas('canvas');

fabric.Image.fromURL('https://i.imgur.com/LJ55MZV.jpeg', function(img) {
  img.scale(0.8).set({
    left: 0,
    top: 0,
    angle: 30,
    centeredScaling: true,
    centeredRotation: true,
    lockUniScaling: true,
    borderColor: 'red',
    cornerColor: 'green',
    cornerSize: 30,    
  });
  canvas.centerObject( img );
  canvas.add(img).setActiveObject(img);
});