gpt4 book ai didi

javascript - Fabric js canvas.remove() 不删除对象

转载 作者:行者123 更新时间:2023-12-01 02:25:37 25 4
gpt4 key购买 nike

所以我在尝试为我的应用程序实现撤消功能的过程中遇到了一个问题,撤消功能有效,但是它要么是 canvas.remove() 由于某种原因不起作用,要么是对象不起作用:删除事件未触发。为了确保该对象确实存在,我console.log它并且果然它确实存在..但是fabric js不会删除该对象,也不会触发该对象:已删除(显然)output console.log

canvas.on('object:added',function(){
h = [];
});
function undo(){
if(canvas._objects.length>0){
console.log(h);
h.push(canvas._objects.pop());
var lastItem = h[h.length - 1];
//Logs the object - check the screenshot
console.log(lastItem);
canvas.remove(lastItem);
canvas.renderAll();
}
}
$("#undo").click(function()
{
undo();
});
//Not firing even though i removed the object..
canvas.on('object:removed',function(object)
{
console.warn(object);
});

最佳答案

如果您使用 canvas.remove() 删除对象,则只会触发 'object:removed' 事件。

演示

var canvas = new fabric.Canvas('canvas');
canvas.add(new fabric.Circle({
left:50,top:50,radius:50,fill:'red'
}))
canvas.add(new fabric.Circle({
left:150,top:150,radius:50,fill:'green'
}))
canvas.add(new fabric.Circle({
left:250,top:250,radius:50,fill:'blue'
}))
canvas.add(new fabric.Rect({
left:250,top:150,width:100,height:100
}));
canvas.requestRenderAll();

function undo(){
var object = canvas.item(canvas.getObjects().length-1);
canvas.remove(object);
}

canvas.on('object:removed',function(object){
console.warn(object);
})
canvas{
border:2px solid #000;
}
<script src="https://rawgit.com/kangax/fabric.js/master/dist/fabric.js"></script>
<button onclick='undo()'>undo</button>
<canvas id='canvas' width=500 height=400>

关于javascript - Fabric js canvas.remove() 不删除对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48834551/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com