Javascript example to demonstrate how to open a new BPMN diagram in a tab.
- ⏩ live environment
- to run locally, open the index.html directly in a Web Browser
After the instantiation of the main BpmnVisualization
object, get the HTML element corresponding to the call activity to add a listener and activate the tab (and deactivate the others).
const callActivityElt = mainBpmnVisualization.bpmnElementsRegistry.getElementsByIds(['call_activity'])[0].htmlElement;
callActivityElt.onclick = () => {
openTab('secondary');
secondaryBpmnVisualization.load(getProcurementBpmnDiagram(), { fit: {type: 'Center'} });
}
BPMN container
(in charge of displaying the Call Activity) must be visible during the BPMN diagram loading, otherwise, some BPMN elements won't be displayed.