fabricjs克隆对象影响旧（默认）对象

Question

我试图在不影响结构输出的情况下获得Text对象的阴影。

代码

var clonedText = jQuery.extend({}, obj);
clonedText.fill = "rgba(50,50,50,0.5)";
imageURL = clonedText.toDataURL({format:'png'});

结果

默认： AfterRun：

如何修复？ 我的意思是如何复制对象以便无法影响默认图像？

更新：

我也试过这个和这个。

canvas._objects.forEach(function(obj, index){
 var clonedText = fabric.util.object.clone(obj);
    clonedText.fill = "rgba(50,50,50,0.5)";
    imageURL = clonedText.toDataURL({format:'png'});
});

这有相同的结果。

Answer 1

所以你不应该像克隆javascript对象一样克隆实例。 Fabric对象可以引用canvas元素，图像元素，深层结构，每个克隆逻辑都可以独立工作。

在fabricjs docs上指定fabric.util.object.extende / clone不克隆fabricJS对象：

http://fabricjs.com/docs/fabric.util.object.html

同样在文档中指定了克隆方法：

所以你必须运行

myText.clone(function(cloned) {
  // do something with cloned....
});

如果您需要完全同步的过程，并且您没有使用文本的图案或图像源，您也可以这样做：

var objectForm = myText.toObject();
var clonedText = new fabric.Text(objectForm.text, objectForm);