We have used BPMN in our Javascript (MERN) based project, and applied certain customizations in components and design. Now, when I opened the diagram page, I want that it should zoom in a little bit, and the position of the canvas should be at the start of the flow by default i.e. the portion of the start of the flow should be zoomed in for better visibility.
I tried using CSS, and canvas.viewBox() for this, but then my diagram vanished from the canvas. Can someone please assist?
static async renderDiagramCanvas(diagramXML) {
const modeler = ModelerService.getModeler();
await modeler.importXML(diagramXML);
const canvas = modeler.get("canvas");
canvas.zoom("fit-viewport", "auto");
canvas.zoom(0.6);
}