внешний вид ограничительной рамки — управление настройкой с помощью fabricjs

Самый быстрый способ настроить элементы управления — написать собственную функцию _drawControl и сделать ее совместимой со стандартом Fabricjs, чтобы переопределить ее. Помните, что эта функция вызывается 9 раз для каждого рендера, так что старайтесь не использовать код и рисунки. Также, если вы изменяете контекст ( ctx ), не забудьте использовать .save и .restore, чтобы не испортить конвейер рендеринга.

FabricJs вызовет функцию с top и left, готовыми для прямоугольника, поэтому угол будет в top + size/2 и left + size/2, где размер равен this.cornerSize.

function newControls(control, ctx, methodName, left, top) {
  if (!this.isControlVisible(control)) {
        return;
      }
      var size = this.cornerSize;
      isVML() || this.transparentCorners || ctx.clearRect(left, top, size, size);
      ctx.arc(left + size/2, top + size/2, size/2, 0, 2 * Math.PI, false);
      ctx.stroke();
}

fabric.Object.prototype._drawControl = newControls;

function newControls(control, ctx, methodName, left, top) {
  if (!this.isControlVisible(control)) {
        return;
      }
      var size = this.cornerSize;
      this.transparentCorners || ctx.clearRect(left, top, size, size);
      ctx.beginPath();
      ctx.arc(left + size/2, top + size/2, size/2, 0, 2 * Math.PI, false);
      ctx.stroke();
}

fabric.Object.prototype._drawControl = newControls;
fabric.Object.prototype.cornerSize = 15;
var canvas = new fabric.Canvas('c');


canvas.add(new fabric.Rect({width:100, height:100, top:50, left:50}));
canvas.setActiveObject(canvas.getObjects()[0]);

<script type ="text/javascript" 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>

Проверьте эти примеры:

http://fabricjs.com/customization/

Пример 2:

var canvas = new fabric.Canvas('c3');
  canvas.add(new fabric.Circle({ radius: 30, fill: '#f55', top: 100, left: 100 }));

  canvas.item(0).set({
    borderColor: 'red',
    cornerColor: 'green',
    cornerSize: 6,
    transparentCorners: false
  });
  canvas.setActiveObject(canvas.item(0));