Adds bpmn-in-color support to bpmn-js
JavaScript CSS HTML
Pull request Compare This branch is 5 commits ahead of vkatushenok:master.
Latest commit 66dfe08 Sep 16, 2016 @nikku nikku docs(project): document usage
Permalink
Failed to load latest commit information.
app chore(project): separate app and library Sep 16, 2016
colors chore(project): separate app and library Sep 16, 2016
resources chore(project): add screenshot Sep 16, 2016
.eslintrc chore(app): basic modeler setup Aug 12, 2016
.gitignore feat(app): base implementation Sep 13, 2016
Gruntfile.js
README.md docs(project): document usage Sep 16, 2016
index.js
package.json

README.md

bpmn-js in color

This example show cases how to extend bpmn-js with colors based on the BPMN in Color proposal.

bpmn-js in color

Features

  • Recognize and display BPMN in Color meta-data
  • Change color of elements via context pad

Use Extension

Fetch bpmn-js-in-color as a dependency:

npm install bpmn-io/bpmn-js-in-color --save

Extend your BPMN modeler with colors:

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

var modeler = new BpmnModeler({
  additionalModules: [
    require('bpmn-js-in-color')
  ]
});

Add diagram-js, bpmn-font and color picker stylesheets:

<link rel="stylesheet" href="vendor/diagram-js.css" />
<link rel="stylesheet" href="vendor/bpmn-font/css/bpmn-embedded.css" />
<link rel="stylesheet" href="vendor/colors/color-picker.css" />

Build Demo

To run the live demo (as shown in the screenshot above) execute:

npm run dev

Useful Resources