JSFiddle - React, Tailwind, and code Playground

by InferOn

HTML

<script src="https://rawgit.com/kangax/fabric.js/master/dist/fabric.js"></script>
  <button onclick="gonext(1)">Next</button>
  <div >
      <canvas id="mycanvas" style="border:1px solid black"></canvas>
  </div>

JavaScript

function gonext(idx) {
  var objs = fcanvas.getObjects();
  fcanvas.setActiveObject(objs[idx]);
}

var fcanvas = new fabric.Canvas("mycanvas");
fcanvas.setWidth(500);
fcanvas.setHeight(1200);
var rect = new fabric.Rect({
  left: 10,
  top: 10,
  width: 50,
  height: 50,
  fill: '#FF454F'  
});
fcanvas.add(rect);
fcanvas.setActiveObject(rect);
var rect = new fabric.Rect({
  left: 10,
  top: 1100,
  width: 50,
  height: 50,
  fill: '#FF454F'
});
fcanvas.add(rect);
fcanvas.renderAll();