Create post-it boards - built with diagram-js
Create post-it brainstorming boards - built with diagram-js.
Checkout the Demo or the Experiments Page to get some inspiration.
Install the package to include it into your web application
$ npm install postit-js-core --save
To get started, create a postit-js instance and render a post-it board into your web application
import 'postit-js-core/assets/postit-js.css';
import PostItModeler from 'postit-js-core/lib/Modeler';
let xml; // my post-it xml
const modeler = new PostItModeler({
container: '#canvas',
keyboard: {
bindTo: window,
}
});
modeler.importXML(xml).then(function() {
console.log('board rendered');
}).catch(function(error) {
console.error('could not import postit board', err);
});
For using postit-js
inside your web application you'll need a source code bundler, e.g. webpack. Checkout the example for getting inspiration.
Spin up the application for development, all strings attached:
$ npm install
$ cd example
$ npm install
$ npm run dev
Since diagram-js
and also this project is extendable by design, there exist a couple of great community maintained extensions
drag-drop-images
- Drag and drop image files on the boardselection-organizer
- Organize and distribute groups of elementsproperties-panel
- Properties panel for post-it elementsMIT
Contains parts of (bpmn-io) released under the bpmn.io license.