BpmnViewer with zoom option

Alessia_Volpi · May 30, 2024, 2:01pm

Hi, I’m using a BpmnViewer to show up some diagrams that must not be editable, but i wonder if there is a way to make the zoom in/ zoom out still possible. Because for now it isn’t. i can just visualize the diagram but i cannot move the space to see it better.
My viewer:
var secondViewerOnly = new BpmnViewer({});
of course i attach my container in a second moment

Martin · May 30, 2024, 2:05pm

Have you tried the Navigated Viewer?

github.com

bpmn-io/bpmn-js/blob/develop/lib/NavigatedViewer.js

import inherits from 'inherits-browser';

import Viewer from './Viewer';

import KeyboardMoveModule from 'diagram-js/lib/navigation/keyboard-move';
import MoveCanvasModule from 'diagram-js/lib/navigation/movecanvas';
import ZoomScrollModule from 'diagram-js/lib/navigation/zoomscroll';

/**
 * @typedef { import('./BaseViewer').BaseViewerOptions } BaseViewerOptions
 */

/**
 * A viewer with mouse and keyboard navigation features.
 *
 * @template [ServiceMap=null]
 *
 * @extends Viewer<ServiceMap>
 *
 * @param {BaseViewerOptions} [options]

This file has been truncated. show original

Alessia_Volpi · May 30, 2024, 2:13pm

Thank you very much, this was what i was looking for!

system · June 6, 2024, 2:13pm

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.