让用户删除选定的结构js对象 [英] Let user delete a selected fabric js object

问题描述

我有一个简单的基于面料js的应用程序，我会让用户添加形状连接它们并为它们设置动画。

I have a simple fabric js based application where I will let users add shapes connect them and animate them.

以下是我的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);
}

这是我的小提琴。您可以点击新动画，然后添加截至目前的对象。

This is my Fiddle. You can click on new animation and then add objects as of now.

我希望用户选择一些对象然后也可以删除它我不知道如何。我发现这个一次删除多个对象在html5的fabric.js画布上但是我无法成功实现它。我基本上希望用户能够选择一个对象并删除它。

I want the user to select some object and then also be able to delete it I am not sure how. I found this Delete multiple Objects at once on a fabric.js canvas in html5 But i was not able to implement it successfully. I basically want users to be able to select an object and delete it.

推荐答案

你可以使用remove（）方法，例如。

You can use the remove() method, eg.

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

jsfiddle

这篇关于让用户删除选定的结构js对象的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！