How to attach a Signal element to the BPMN 2.0 document

Developers Modeler
1

I’m a bit confused about the creation of the Signal event because if they are already created, they are not accessible though the elementRegistry and I don’t know the way to add them to the diagram.

I create it this way:

      var signalElement = renderer.get('moddle').create('bpmn:Signal', {
        id: 'my_signal_id',
        name: 'myname'
      });

Any suggestion to add to the diagram because they are only accessible via renderer.get(‘canvas’) ?

2

Based on your previous postings in this forum it seems like there is a misunderstanding about BPMN and/or how the interaction between BPMN and diagram elements in bpmn-js works.

Regarding the interaction there is a few important things to know:

  • We parse the BPMN 2.0 XML into a object tree.
  • For each relevant visual element we create graphical shapes and connections on the diagram.
  • Each graphical element references the underlying BPMN element via element.businessObject.
  • Invisible elements, i.e without attached DI (diagram interchange) information are not drawn and thus not visible via diagrams elementRegistry.

Regarding bpmn:Signals: Signals are just like that: Invisible and not part of the canvas. They are still important though because they are linked to a SignalEventDefinitions that may be part of a drawn Event.

3

If you are asking, how to create a ThrowingIntermediateEvent with a signal event definition attached, try this:

var elementFactory = diagram.get('elementFactory'),
    bpmnFactory = diagram.get('bpmnFactory');

// (0) create the bpmn element(s)
var signalEventDefinition = bpmnFactory.create('bpmn:SignalEventDefinition');

var throwingIntermediateEvent = bpmnFactory.create('bpmn:ThrowingIntermediateEvent', {
  eventDefinitions: [ signalEventDefinition ]
});


// (1) create the graphical element(s)

elementFactory.create('shape', {
  id: throwingIntermediateEvent.id,
  businessObject: throwingIntermediateEvent
});


// (...) add to canvas directly or via modeling#createShape
// depending on your use-case
4

Questions:

  1. How to add to de canvas directly instead using modeling#createShape?
  2. How to get the businessObject of the SignalEventDefinition in order to set its signalRef property to the Signal component?

Thanks!

5

Solved. The solution is

function createSignalProperty() {
  var signalElement = renderer.get('moddle').create('bpmn:Signal', {
      id: 'the unique Id',
      name: 'the name'
  });

  var rootElement = renderer.get('canvas').getRootElement().businessObject.$parent.rootElements;
  rootElement.push(signalElement);
}
```
2 Likes