Fabric.js: Waiting for images to load before rendering on node.js

[thedarkside]

As mentioned in #2735 i have trouble to render images correctly. The reason is that the render script just renders the image before all images are loaded.
Do you have any suggestions how to wait for _all images_ to be loaded before calling renderAll() and export as PNG?

[keanass]

Hello,
I had the same problem, unfortuntly fabricjs dosn't support waiting for all images is loading. So my approch was to get count of image objects from my source json and increment a counter on every image load callback, When the counter equals the number of images extracted from json, i inject my todo code there. So this is how i solved the problem and hope that fabric team think about this approch or give us previliges to do this on next version

[thedarkside]

Thank you for your answer. I have a nice solution when you use loadFromJSON:
canvas.loadFromJSON(d, function(){ render(canvas) });

The callback is called after all images are loaded.
For manually added images ill implement your suggestion for now.

[keanass]

@thedarkside canvas.loadFromJSON(d, function(){ render(canvas) }); not waiting images to load, maybe you are using small size images, in my case i was playing with big size images.

[thedarkside]

@keanass it's a 1mb PNG (1800x1300). I have to say that i am using the current master branch version of fabric.

[snq]

@thedarkside I don't believe canvas.loadFromJSON(d, function(){ render(canvas) }); waits for the images to load on canvas. It certainly waits for non-images objects, not images.

[certifirm]

Same as @snq

[asturur]

i do not remember sincerly, but the Image.fromObject function contains the answer