FabricJs Ctrl C + Ctrl V

Question

我正在尝试使用 ctrl+c 和 ctrl[=34= 进行复制粘贴操作]+v 与 fabricjs.

我设法做了一些事情。我正在 selecting 和复制粘贴的对象已被复制，但如果我再次按 ctrl+v 该项目是地方在最后一个里面。如果我 select 项目正在改变位置。

复制粘贴操作：

if (map[17] && map[67]) {
    event.preventDefault();
    if(canvas.getActiveGroup()){
        for(var i in canvas.getActiveGroup().objects){
            var object = fabric.util.object.clone(canvas.getActiveGroup().objects[i]);
            object.set("top", object.top+5);
            object.set("left", object.left+5);
            copiedObjects[i] = object;
        }                    
        console.log(copiedObjects);
    }
    else if(canvas.getActiveObject()){
        var object = fabric.util.object.clone(canvas.getActiveObject());
        object.set("top", object.top+5);
        object.set("left", object.left+5);
        copiedObject = object;
        copiedObjects = new Array();
        console.log(copiedObjects);
    }
}else if(map[17] && map[86]){
    event.preventDefault();
    console.log(copiedObjects);
    if(copiedObjects.length > 0){
        for(var i in copiedObjects){
            canvas.add(copiedObjects[i]);
        }                    
    }
    else if(copiedObject){
        canvas.add(copiedObject);
    }
    canvas.deactivateAll().renderAll();
}

我做了一个JsFiddle

请进入 JsFiddle 和 select 该对象。按 ctrl+c 然后 ctrl+v 两次然后 select 这两个对象。到时候你就会明白我的问题是什么了。

谢谢

Answer 1

我的解决方案对于这个问题，我从复制的对象创建了新对象并将其添加到 canvas

而不是

canvas.add(copiedObject);

我正在做这个

var object = fabric.util.object.clone(copiedObject);
object.set("top", object.top+5);
object.set("left", object.left+5);
copiedObject1 = object;
canvas.add(copiedObject1);

这是我的 jsfiddle：- https://jsfiddle.net/n5a1wkfb/2/

FabricJs Ctrl C + Ctrl V

FabricJs Ctrl C + Ctrl V

jquery

fabricjs