fabricjs - Zoom canvas in viewport (possible?)

Question

at the moment I try to implement a zoom-functionallity to a visual-editor based on the fabricjs-framework.

I've looked around but got more and more confused as I recognized that the development of this feature/function was a long and rocky road for the community and developers.

Because of that, many solutions seems to be already outdated.

But at the moment I found fabric-viewport developed by the RTSGroup on Github.

The implementation was easy, but it only can zoom/control the objects in (inner of) the canvas. Not the canvas too. But I would like to zoom the canvas, too. (inner of the viewport)

For better understanding what I'm looking for I made a simple explanation-image:

Is there a way to do this with the fabricjs-viewport plugin or another not outdated solution?

I saw already some pages who using such viewport like zoom feature with scroll support, too. But there I wasn't sure if they belong to the fabricjs-framework.

Thanks already for every hint and tipp which could lead me to the right direction.

Greetings, Sascha

Answer 1

@Theo solution is great, but one thing: Instead of using object.scaleX and object.scaleY to scale each object in the canvas, you can just call once to canvas.setZoom(ZOOM_INDEX). (only from version 1.4.13 of fabricjs)

An example I made is Here