Позвольте пользователю удалить выбранный объект js fabric

У меня есть приложение на основе простого java-приложения, в котором я хочу, чтобы пользователи добавляли формы, соединяли их и анимировали.

Следующим является мой JS

var canvas; 
window.newAnimation = function(){
   canvas = new fabric.Canvas('canvas');
}

window.addRect = function(){
    var rect = new fabric.Rect({
  left: 100,
  top: 100,
  fill: 'red',
  width: 20,
  height: 20,
});
    canvas.add(rect);

}

window.addCircle = function(){
    var circle = new fabric.Circle({
  radius: 20, fill: 'green', left: 100, top: 100
});
    canvas.add(circle);
}

Это мой Fiddle. Вы можете щелкнуть по новой анимации, а затем добавить объекты на данный момент.

Я хочу, чтобы пользователь выделил какой-то объект, а затем также смог его удалить. Я не уверен, как это сделать. Я нашел это Удалить несколько объектов сразу на холсте fabric.js в html5 Но я не смог его успешно реализовать. В основном я хочу, чтобы пользователи могли выбирать объект и удалять его.

Ответы

Ответ 1

Вы можете использовать метод remove(), например.

window.deleteObject = function() {
        canvas.getActiveObject().remove();
}

jsfiddle

Ответ 2

Поскольку была выпущена новая версия fabric.js - вы должны использовать:

canvas.remove(canvas.getActiveObject());