title: Cloning objects in Fabric.js
body: <p>I am cloning a selected object on a canvas in Fabric.js using a simple function. </p>
  
  <pre><code>function duplicateObj() {
    var obj = canvas.getActiveObject();
    var clone = fabric.util.object.clone(obj);
    clone.set({left: 100,top: 100});
    canvas.add(clone); 
  }
  </code></pre>
  
  <p>That works absolutely fine. Now if I work with the object and the clone is not required anymore and I select and delete it, both objects, the clone and the original object are deleted. The delete function is:</p>
  
  <pre><code>function deleteObj() {
    var obj = canvas.getActiveObject();
    canvas.fxRemove(obj);
  }
  </code></pre>
  
  <p>The objects are the same. Is there are way to clone objects and make the clone independent of the of the original? I tried this:</p>
  
  <pre><code>function duplicateObj() {
    var obj = canvas.getActiveObject();
    var clone = fabric.util.object.clone(obj);
    clone.initialize();
    $.extend(clone, obj);
    fabric.util.object.extend(clone, obj);
    clone.set({left: 100,top: 100});
    canvas.add(clone); 
  }
  </code></pre>
  
  <p>It works, however the objects are the same again and if I only use initialize I am ending up with an object that has now properties set.  </p>