Resizing a viewer

I have 2 parts to this question:

If I create a viewer using BpmnNavigatedViewer({ container: ‘#canvas1’, width: ‘1300px’, height: ‘800px’ })

is it possible to resize it on the fly according to the the size of the diagram being displayed?

Which brings me to the second part. Is there an easy way to calculate the size of a diagram?


Hi Moderators,

If it is possible kindly say how it could be done, if not say no it can’t.

You cannot resize the viewer to the diagram size.

You can resize the diagram to fit the viewport (diagram width / height) via


Retrieve the width of the displayed diagram via


Thanks for your reply nikku, much appreciated.

Hi, I have the problem that despite using “canvas.zoom(‘fit-viewport’);” The Viewer is only showing the very top of my BPMN.
Is the Viewport limited by something or am I doing anything else worng?
I used the quick Introduction to embed a viewer in html / js


Fixed it by defining 'style=“height: 500px” ’ directly in the div where I defined the canvas.
-> <div id="canvas" style="height: 500px"></div>