CODEWITHSUNDEEP
jqueryasp.net-mvc-4razorfabricjs
Saloni
Saloni

Reputation: 527

Loading image in FabricJs

I am working with FabricJs in which I am designing a web template. I have one requirement to show the loading image while canvas is loading objects (multiple images and drawing objects). But I am unable to find an event which render after all object get loaded on the canvas. Could you please suggest me some solution?

Thanks in advance. Saloni

Upvotes: 1

Views: 2197

Answers (2)

Ashokbharathi
Ashokbharathi

Reputation: 146

Please check if it helpful for you, canvas.loadFromJSON has the callback function, hide the loading message with in the callback.Here is the updated fiddle http://jsfiddle.net/mk410jLo/

canvas.loadFromJSON(json,function(){
canvas.renderAll();
setTimeout(function(){
$(".loading-bar").hide();
},100);});

Upvotes: 0

Innodel
Innodel

Reputation: 1426

You have one way to achieve this task is that you can loop through all json object and add them one by one and after adding them to canvas, don't call canvas.renderAll(). you have to call canvas.renderAll() after loop is completed. this way after:render will get fired only once after all objects are loaded to canvas.
You can look to this fiddle : http://jsfiddle.net/a6zuy11q/8/

Upvotes: 2

Related Questions