How can i add zoom in/out functionality for bpmn diagram


#1

please tell me if there is any way to add zoom in/out functionality for bpmn diagram


#2

Where did you look to answer this question? What did you try already?


#3

i did this in workflow-bpmn.js file. but it is showing error on the line β€œvar viewer = new BpmnNavigatedViewer({ container: β€˜#js-canvas’ });”

var BpmnModeler = require('bpmn-js/lib/Modeler');
var BpmnNavigatedViewer = require('bpmn-js/lib/NavigatedViewer.js');

function createInstance() {
        var object = new BpmnModeler({
            container: canvas,
            propertiesPanel: {
                parent: '#js-properties-panel'
            },

            additionalModules: [
                propertiesPanelModule,
                propertiesProviderModule,
                incidentColorPaletteModule,
                incidentColorDrawModule,
                sendContactDispatchDrawModule,
                sendContactDispatchPaletteModule,
                logStartEventDrawModule,
                logStartEventPaletteModule,
                logEndEventDrawModule,
                logEndEventPaletteModule,
                checkContactAvailabilityDrawModule,
                checkContactAvailabilityPaletteModule
            ],

            moddleExtensions: {
                magic: customPropsListModule
            }
        });

        return object;
    }

    var viewer = new BpmnNavigatedViewer({ container: '#js-canvas' });

#4

BpmnNavigatedViewer is exactly the right component to use.

What error does it show?


#5

it is not recognizing my canvas i guess. Undefined it says thats it.


#6

Seems like we cannot help you then.