FabricJS延迟绘图？

Question

我有一个小小的演示，我设置。

var image1 = "http://i.imgur.com/b81Wj6O.png"; 
var image2 = "http://i.imgur.com/vmtt98e.jpg"; 
var backgroundImage; 
var toggle = true; 

document.getElementById("button").addEventListener("click", update); 

var canvas = new fabric.StaticCanvas('canvas', { 
    width: 800, 
    height: 600 
}); 

function update() { 
    var background; 
    if (toggle) { 
     background = image1; 
    } else { 
     background = image2; 
    } 
    toggle = !toggle; 
    if(backgroundImage == null) { 
     fabric.Image.fromURL(background, function(img){ 
     backgroundImage = img; 
     canvas.add(img); 
    }); 
    } 
    else { 
    backgroundImage.setSrc(background); 
    } 
    canvas.renderAll(); 
} 

https://jsfiddle.net/rhLa38dt/

如果你点击它应该绘制图像按钮，我遇到的问题是，当你点击该按钮第二次图像不会更新。然而第三次它会画出图像，它应该有第二次，并继续从那里总是落后一步。

Answer 1

使用回调设置它的源后呈现在画布上：

backgroundImage.setSrc(background, function() { 
    canvas.renderAll(); 
}); 

更新工作的jsfiddle，https://jsfiddle.net/rekrah/nzgf1ja4/。