bpmn js

BPMN-JS - BPMN 2.0 pour le Web

Afficher et modifier les diagrammes BPMN 2.0 dans le navigateur.

Installation

Utilisez la bibliothèque préemballée ou incluez-le via NPM dans votre application Web de style nœud.

Usage

Pour commencer, créez une instance BPMN-JS et rendez les diagrammes BPMN 2.0 dans le navigateur:

 const xml = '...' ; // my BPMN 2.0 xml
const viewer = new BpmnJS ( {
  container : 'body'
} ) ;

try {
  const { warnings } = await viewer . importXML ( xml ) ;

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

Découvrez nos exemples pour de nombreux autres scénarios d'utilisation pris en charge.

Attachement dynamique / détachement

Vous pouvez également attacher ou détacher le spectateur dynamiquement à n'importe quel élément de la page:

 const viewer = new BpmnJS ( ) ;

// attach it to some element
viewer . attachTo ( '#container' ) ;

// detach the panel
viewer . detach ( ) ; 

Ressources

• Démo
• Problèmes
• Exemples
• Forum
• Changelog

Construire et courir

Préparez le projet en installant toutes les dépendances:

npm install

Ensuite, selon votre cas d'utilisation, vous pouvez exécuter l'une des commandes suivantes:

 # build the library and run all tests
npm run all

# spin up a single local modeler instance
npm start

# run the full development setup
npm run dev

Vous devrez peut-être effectuer une configuration de projet supplémentaire lors de la création du dernier instantané de développement.

En rapport

BPMN-JS s'appuie sur quelques outils puissants:

• BPMN-Moddle: Lire / Écrivez la prise en charge de BPMN 2.0 XML dans les navigateurs
• Diagramme-js: Rendu du diagramme et modification de la boîte à outils

Il s'agit d'une boîte à outils extensible, complétée par de nombreux services publics supplémentaires.

Licence

Utiliser selon les termes de la licence BPMN.IO.