Why connection draw behind group?


#1

11

I connected the connection using customRules,
but the connection is drawn behind the group.

What’s the problem with this?
Which part should I look at ??


#2

What element type are the white rectangles?


#3

That’s Bpmn:SubProcess


#4

There is two places you’d need to look into:

  • Ensure that the diagram is imported in the correct manner
  • Ensure that the connection is rendered / recognized in the correct order, cf. BpmnOrderingProvider that implements this for message flows (always rendered on top),.

I want to implement CustomRules
#5

Share an example of what you’re doing and we’ll be able to help you in a more focussed / efficient manner.


#6

i implemented

 var orders = [
    { type: 'bpmn:SubProcess', order: { level: 6 } },
    {
      type: 'bpmn:SequenceFlow',
      order: {
        level: 9,
        containers: [
          'bpmn:Participant',
          'bpmn:SubProcess',
          'bpmn:FlowElementsContainer'
        ]
      }
    },
    // handle DataAssociation(s) like message flows and render them always on top
    {
      type: 'bpmn:DataAssociation',
      order: {
        level: 9,
        containers: [
          'bpmn:Collaboration',
          'bpmn:Process'
        ]
      }
    },
    {
      type: 'bpmn:MessageFlow', order: {
        level: 9,
        containers: [ 'bpmn:Collaboration' ]
      }
    },
    {
      type: 'bpmn:Association',
      order: {
        level: 6,
        containers: [
          'bpmn:Participant',
          'bpmn:FlowElementsContainer',
          'bpmn:Collaboration'
        ]
      }
    },
    { type: 'bpmn:BoundaryEvent', order: { level: 8 } },
    { type: 'bpmn:FlowElement', order: { level: 5 } },
    { type: 'bpmn:Participant', order: { level: -2 } },
    { type: 'bpmn:Lane', order: { level: -1 } }
  ];

‘bpmn:SequenceFlow’ is higher level than bpmn:SubProcess.
but drawn behind ‘bpmn:SubProcess’


#7

com-crop

It is now working like this.
Please give me a solution.
There is no change in BpmnOrderingProvider,


#8

To be more precise: Share a complete, runnable example of what you are doing and we are able to help you.


#9

<CustomRules.js>

function canConnectSequenceFlow(source, target) {
  return isSequenceFlowSource(source) &&
    isSequenceFlowTarget(target) &&
    // isSameScope(source, target) && // deleted
    !(is(source, 'bpmn:EventBasedGateway') && !isEventBasedTarget(target));
}

<CustomReplaceConnectionBehavior.js>

function fixConnection(connection) {

    var source = connection.source,
      target = connection.target,
      parent = connection.parent;

    // do not do anything if connection
    // is already deleted (may happen due to other
    // behaviors plugged-in before)
    if (!parent) {
      return;
    }

    var replacementType,
      remove;

    /**
     * Check if incoming or outgoing connections
     * can stay or could be substituted with an
     * appropriate replacement.
     *
     * This holds true for SequenceFlow <> MessageFlow.
     */

    if (is(connection, 'bpmn:SequenceFlow')) {
      if (!customRules.canConnectSequenceFlow(source, target)) {
        // remove = true;
      }

      if (customRules.canConnectMessageFlow(source, target)) {
        replacementType = 'bpmn:MessageFlow';
      }
    }

    // transform message flows into sequence flows, if possible

    if (is(connection, 'bpmn:MessageFlow')) {

      if (!customRules.canConnectMessageFlow(source, target)) {
        remove = true;
      }

      if (customRules.canConnectSequenceFlow(source, target)) {
        replacementType = 'bpmn:SequenceFlow';
      }
    }

    if (is(connection, 'bpmn:Association') && !bpmnRules.canConnectAssociation(source, target)) {
      remove = true;
    }


    // remove invalid connection, // deleted
    // unless it has been removed already
    // if (remove) {
    //   modeling.removeConnection(connection);
    // }

    // replace SequenceFlow <> MessageFlow

    // if (replacementType) { // deleted
    //   modeling.connect(source, target, {
    //     type: replacementType,
    //     waypoints: connection.waypoints.slice()
    //   });
    // }
  }

and, white rectangle is ‘Bpmn:SubProcess’, blue rectangle is ‘Bpmn:Task’.
and connection is ‘Bpmn:SequenceFlow’.
and other source is same


#10

As a follow up to this, I also have the same issue as this one. We are seeking to allow users to connect sequence flows across swim lanes. We have successfully set up our custom rule to allow this, but are now experiencing the issue above. We have added a custom ordering provider as suggested, but it doesn’t seem to be overriding the order already added to the element, so is being ignored. Is there an example anywhere or some documentation on the right way to override the order in the orderingprovider please?