Fabric.js: Setting the canvas viewport so all objects fit within the canvas dimensions.

[scottmilward]

I am curious about this issue I am running into.

I am adding fabric objects that have a left/top/width/height property value that is largert than the current canvas width and height.

I am wanting to be able to zoom out/modify the viewport so all those objects fit nicely within the canvas dimensions.

Is there a specific/proper way to go about easily doing this?

[asturur]

This is not a fabricjs issue, it looks more you are looking for help for your own application, so googlegroup and stackoverflow are better places for that.
This board is dedicated to fixing issue of the library.

Anyway, your problem is mainly find out the bouding box of all the object int canvas.
Once you know the top, left and total width and total height you can easily find your zoom level and panning point.

To do that you can create a group with all objects, and then call the method getBoundingBox of the resulting group.

OR

You can take the untrasformed points of every object (-width/2, -height/2), (-width/2, height/2), (width/2, -height/2), (width/2, height/2) and transform every point of every object for the transformation matrix of the object.
once you have all the transformed point you take max and min of both x and y and this is your bouding box.