号（コピー＆ペースト）

Question

私はFabricJSを使用してキャンバスにオブジェクトをコピー＆ペーストしようとしています：

コピーした項目がオブジェクトであるとき、私はそれが完璧に働いて得ることができます。しかし、アイテムがグループである場合、それは崩れます。

私はこのフィドル（私が知っている混乱）をまとめましたが、より大きな、より組織化されたスクリプト（問題を再現するのに十分です）のいくつかの異なる部分をまとめました。選択したサークルで

https://jsfiddle.net/chrissp26/xxd6h80t/

ペーストボタンを押すと、それがオフセット5pxのでオブジェクトのクローンをコピーして貼り付けます。完璧。

2つあるので、両方を選択して同じことを試してください。元の円は消え、複製された円は消えたり移動したりした後、???ここで

ペースト機能は次のとおりです。（）関数は、最近いくつかの変更を受けている

var _paste = function() { 

    var activeObject = _canvas.getActiveObject(), 
    activeGroup = _canvas.getActiveGroup(); 

    if (_clipboard.objects) { 

    var group = new fabric.Group(); 

    for (var i in _clipboard.objects) { 

     var object = fabric.util.object.clone(_clipboard.objects[i]); 

     group.addWithUpdate(object); 

    } 

    group 
     .set("top", _clipboard.top + 5) 
     .set("left", _clipboard.left + 5) 
     .setCoords(); 

    _canvas 
     .setActiveGroup(group) 
     .add(group); 

    } else { 

    var object = fabric.util.object.clone(_clipboard); 

    object 
     .set("top", _clipboard.top + 5) 
     .set("left", _clipboard.left + 5) 
     .setCoords(); 

    _canvas 
     .add(object) 
     .setActiveObject(object) 
     .renderAll(); 
    } 
} 

Answer 1

クローンの振る舞い、次のコードは、（私がいることに注意してくださいFabric.js 1.7.0を使用して、私の作品あなたは）自分のバイオリンで1.5.0を使用している：

if (_clipboard.objects) { 

    var group = new fabric.Group(); 

    for (var i in _clipboard.objects) { 
     _clipboard.objects[i].clone(function (clonedObj) { 
     group.addWithUpdate(clonedObj); 
     if (group.size() == _clipboard.objects.length) { 
      group 
     .set("top", _clipboard.top + 5) 
     .set("left", _clipboard.left + 5) 
     .setCoords(); 

    _canvas 
     .setActiveGroup(group) 
     .add(group); 
    } 
    }); 


} 

EDIT：私は別の外出を持っていたし、それが正しく動作しているようだ、グループでは、グループのクローンを作成するのが最善だと思われます、コールバックで各オブジェクトを缶に追加しますエレメントは、クローニング後に移動したときにVAS、および

Fiddle

_clipboard.clone(function (clonedObj) { 
     _canvas.discardActiveGroup(); 
     clonedObj.set({ 
      left: clonedObj.left+10, 
      top: clonedObj.top+10, 
      evented: true 
     }); 

     clonedObj.forEachObject(function(obj){ 
      obj.set('active', true); 
      _canvas.add(obj); 
     }); 

     _canvas.setActiveGroup(clonedObj).renderAll(); 
    });