The project is still in an early stage. Documentation may be missing and examples may be broken.

bpmn-js - BPMN 2.0 for the web

bpmn-js is the BPMN 2.0 diagram modeling and rendering toolkit that powers bpmn.io.

Usage

No need for additional setup: Try out our seed project or use the pre-packaged version of the library.

Get the library via npm or Bower and use it in your web applications to display BPMN 2.0 diagrams.

var BpmnViewer = require('bpmn-js');

var xml; // my BPMN 2.0 xml
var viewer = new BpmnViewer({ container: 'body' });

viewer.importXML(xml, function(err) {

  if (err) {
    console.log('error rendering', err);
  } else {
    console.log('rendered');
  }
});

Install bpmn-js

via bower

bower install bpmn-js

Make sure to include the library + all dependencies into the website.

Checkout an example project that shows how to use the library in web applications.

via npm

npm install --save bpmn-js

Make sure you use browserify or the like to bundle your project and bpmn-js for the browser.

Checkout an example project that shows how to use bpmn-js in node-style web applications.

Resources

• Demo
• Issues
• Examples
• Forum

Tools

bpmn-js builds on top of a few additional powerful tools

• bpmn-moddle: Read / write support for BPMN 2.0 XML in the browsers
• diagram-js: Diagram rendering and editing toolkit

Building the Project

As long as the project is in alpha stage, you must make sure you setup the whole development environment, including a number of project dependencies according to our development setup.

License

Use under the terms of the bpmn.io license.