1 | # dmn-js - DMN for the web
|
2 |
|
3 | [![Build Status](https://travis-ci.org/bpmn-io/dmn-js.svg?branch=master)](https://travis-ci.org/bpmn-io/dmn-js)
|
4 |
|
5 | View and edit DMN 1.3 diagrams in the browser.
|
6 |
|
7 |
|
8 | ## Installation
|
9 |
|
10 | Use the library [pre-packaged](https://github.com/bpmn-io/dmn-js-examples/tree/master/pre-packaged)
|
11 | or include it [via npm](https://github.com/bpmn-io/dmn-js-examples/tree/master/bundling)
|
12 | into your node-style web-application.
|
13 |
|
14 |
|
15 | ## Usage
|
16 |
|
17 | To get started, create a [dmn-js](https://github.com/bpmn-io/dmn-js) instance
|
18 | and render [DMN 1.3 diagrams](http://www.omg.org/spec/DMN/About-DMN/) in the browser:
|
19 |
|
20 | ```javascript
|
21 | var xml; // my DMN 1.3 xml
|
22 | var viewer = new DmnJS({
|
23 | container: 'body'
|
24 | });
|
25 |
|
26 | viewer.importXML(xml, function(err) {
|
27 |
|
28 | if (err) {
|
29 | console.log('error rendering', err);
|
30 | } else {
|
31 | console.log('rendered');
|
32 | }
|
33 | });
|
34 | ```
|
35 |
|
36 | Checkout our [examples](https://github.com/bpmn-io/dmn-js-examples) for
|
37 | more supported usage scenarios.
|
38 |
|
39 |
|
40 | ### Dynamic Attach/Detach
|
41 |
|
42 | You may attach or detach the viewer dynamically to any element on the page, too:
|
43 |
|
44 | ```javascript
|
45 | var viewer = new DmnJS();
|
46 |
|
47 | // attach it to some element
|
48 | viewer.attachTo('#container');
|
49 |
|
50 | // detach the panel
|
51 | viewer.detach();
|
52 | ```
|
53 |
|
54 |
|
55 | ## Resources
|
56 |
|
57 | * [Demo](http://demo.bpmn.io/dmn)
|
58 | * [Issues](https://github.com/bpmn-io/dmn-js/issues)
|
59 | * [Examples](https://github.com/bpmn-io/dmn-js-examples)
|
60 | * [Forum](https://forum.bpmn.io)
|
61 | * [Changelog](./CHANGELOG.md)
|
62 |
|
63 |
|
64 | ## Related
|
65 |
|
66 | dmn-js builds on top of a few additional powerful tools:
|
67 |
|
68 | * [dmn-moddle](https://github.com/bpmn-io/dmn-moddle): Read / write support for DMN 1.3 XML
|
69 | * [diagram-js](https://github.com/bpmn-io/diagram-js): Diagram rendering and editing toolkit
|
70 | * [table-js](https://github.com/bpmn-io/table-js): Table rendering and editing toolkit
|
71 |
|
72 |
|
73 | ## License
|
74 |
|
75 | Use under the terms of the [bpmn.io license](http://bpmn.io/license). |
\ | No newline at end of file |