我目前正在使用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的回调函数。
发布于 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(){