使用以下代码,我创建了一个Fabric Canvas
canvas = new fabric.Canvas('canvas');
canvas.setWidth(660);
canvas.setHeight(590);
fabric.Image.fromURL('assets/img/materials/marble.bmp', function(image) {
image.set({
// I need this because the image size and the canvas size could be different
// in this way the image always covers the canvas
width:660,
height:590
});
canvas.setBackgroundImage(image);
});
canvas.renderAll();
Canvas 已创建,但是除非在 Canvas 内部单击,否则不会显示背景图像,因为在 Canvas 内部单击时会显示背景。
我正在本地计算机上工作,该应用程序将不会在线发布。
您为什么认为我遇到了这个问题?我做错什么了吗?我该如何解决此问题?
最佳答案
fabric.image.fromURL是异步的。
如果要尽快显示backgroundimage,则必须在回调内调用renderAll()。
否则,在加载完成后,您的鼠标单击将触发renderAll几分之一秒,并且背景将被渲染。
canvas = new fabric.Canvas('canvas');
canvas.setWidth(660);
canvas.setHeight(590);
fabric.Image.fromURL('assets/img/materials/marble.bmp', function(image) {
image.set({
// I need this because the image size and the canvas size could be different
// in this way the image always covers the canvas
width:660,
height:590
});
canvas.setBackgroundImage(image);
canvas.renderAll();
});
关于javascript - Fabric.js背景仅在单击后出现,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/35242410/