https://github.com/bpmn-io/cmmn-js

A CMMN 1.1 rendering toolkit and web modeler.
https://github.com/bpmn-io/cmmn-js

Last synced: 3 months ago
JSON representation

A CMMN 1.1 rendering toolkit and web modeler.

• Host: GitHub
• URL: https://github.com/bpmn-io/cmmn-js
• Owner: bpmn-io
• License: other
• Archived: true
• Created: 2015-09-15T10:02:29.000Z (over 9 years ago)
• Default Branch: develop
• Last Pushed: 2020-10-14T13:12:31.000Z (over 4 years ago)
• Last Synced: 2024-10-31T07:35:21.195Z (3 months ago)
• Language: JavaScript
• Homepage: https://bpmn.io/toolkit/cmmn-js/
• Size: 974 KB
• Stars: 78
• Watchers: 19
• Forks: 41
• Open Issues: 8
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • Contributing: .github/CONTRIBUTING.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-bpmn-io - cmmn-js - CMMN 1.2 case diagram renderer/editor (Libraries)

README

        
# cmmn-js - CMMN 1.1 for the web

[![Build Status](https://travis-ci.com/bpmn-io/cmmn-js.svg?branch=develop)](https://travis-ci.com/bpmn-io/cmmn-js)

View and edit CMMN 1.1 diagrams in the browser.

## Installation

Use the library [pre-packaged](https://github.com/bpmn-io/cmmn-js-examples/tree/master/pre-packaged)

or include it [via npm](https://github.com/bpmn-io/cmmn-js-examples/tree/master/bundling)

into your node-style web-application.

## Usage

To get started, create a [cmmn-js](https://github.com/bpmn-io/cmmn-js) instance

and render [CMMN 1.1 diagrams](http://www.omg.org/spec/CMMN/1.1/) in the browser:

```javascript

var xml; // my CMMN 1.1 xml

var viewer = new CmmnJS({

  container: 'body'

});

viewer.importXML(xml, function(err) {

  if (err) {

    console.log('error rendering', err);

  } else {

    console.log('rendered');

  }

});

```

Checkout our [examples](https://github.com/bpmn-io/cmmn-js-examples) for many

more supported usage scenarios.

### Dynamic Attach/Detach

You may attach or detach the viewer dynamically to any element on the page, too:

```javascript

var viewer = new CmmnJS();

// attach it to some element

viewer.attachTo('#container');

// detach the panel

viewer.detach();

```

## Resources

*   [Demo](http://demo.bpmn.io/cmmn)

*   [Issues](https://github.com/bpmn-io/cmmn-js/issues)

*   [Examples](https://github.com/bpmn-io/cmmn-js-examples)

*   [Forum](https://forum.bpmn.io)

## Building the Project

Perform the following steps to build the library, including running all tests:

```

cd cmmn-js

npm install

npm run all

```

You may need to perform [additional project setup](./docs/project/SETUP.md) when

building the latest development snapshot.

Please checkout our [contributing guidelines](./.github/CONTRIBUTING.md) if you plan to

file an issue or pull request.

## Related

cmmn-js builds on top of a few additional powerful tools:

* [cmmn-moddle](https://github.com/bpmn-io/cmmn-moddle): Read / write support for CMMN 1.1 XML in the browsers

* [diagram-js](https://github.com/bpmn-io/diagram-js): Diagram rendering and editing toolkit

## License

Use under the terms of the [bpmn.io license](http://bpmn.io/license).