如何强制画布fabricJS刷新
如何强制画布fabricJS刷新
提问于 2019-09-17 20:09:24
我目前正在使用fabricJS(version 1.4.0)画布，我在画布上手动添加了100个对象，但是对象只有在单击画布上的任何位置时才会出现，是否有一种强制画布刷新自身的方法？这是我的设想，如果它能有帮助的话。
....
initComplete: function (settings, json) {
let clients = json;
if(clients.length !== 0)
{
//clients is an array of length 100
for (client of clients)
{
let icone = new Image;
if (client.ProfileId !== '')
{
//..Codes pour afficher les client wifi sur le canvas
client_real_left = (client.MapCoordinate.x * baseWidth) / widthFloor;
client_real_top = (client.MapCoordinate.y * baseHeight) / lengthFloor;
client_left = client_real_left;
client_top = client_real_top;
if (client.IconName === 'default.png' || client.IconName === null) {
icone.src = '/Icones/wifi.png';
}
else {
icone.src = '/Icones/' + client.IconName;
}
const wifiClient = new fabric.Image(icone,
{
id: client.ProfileId,
class: 'img_wifiClient',
left: (transX + client_left) * canvasFabric.scale,
top: (transY + client_top) * canvasFabric.scale,
selectable: true,
hasBorders: false,
hasControls: false,
padding: 0,
perPixelTargetFind: true,
width: 24,
height: 24,
originX: 'center',
originY: 'center'
});
canvasFabric.add(wifiClient);
}
} //end if
}initComplete是jQuery DataTable的回调函数。
回答 1
Stack Overflow用户
回答已采纳
发布于 2019-09-18 14:39:02
使用image#setSrc并在回调方法上调用renderAll。
演示
var canvas = new fabric.Canvas('c',{
width:400,
height:400
});
var image = new fabric.Image('');
canvas.add(image);
image.setSrc('https://picsum.photos/200/300',function(){
image.setCoords();
canvas.renderAll();
})canvas{
border:1px solid;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/3.2.0/fabric.js"></script>
<canvas id='c'></canvas>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/57981400
复制相关文章
相似问题
腾讯云开发者
