Mermaid: BPMN 2.0 diagram

Created on 8 May 2018  路  5Comments  路  Source: mermaid-js/mermaid

Hi, I've been gathering some ideas on how to create a new diagram type for BPMN 2.0 following the #177 poll: https://github.com/knsv/mermaid/issues/177#issuecomment-113783249

Naturally, most of the construct is already present in the flowchart diagram as this example demonstrates:
image

graph LR
    subgraph pool
        subgraph earn
            Sa0((start))
            Sa1(work)
            Sa2((receive wage))

            Sa0-->Sa1
            Sa1-->Sa2
            Sa2-->Sa1
        end

       Sa2-.->S0

        subgraph spend
            S0((start))
            S2(Go shopping)
            S3{How much money will I spend?} 
            S1(save for later)
            S4(buy Laptop)
            S5(buy iPhone)
            S6(buy Car)
            S7{ }
            S8((end))
            S9{ }
            S10(pay)

            S0-->S2
            S2 --> S3
            S3-->| =0 | S1
            S3-->| <= 1k | S4
            S3 -->| > 1k| S5
            S3 -->| >10k | S6
            S1-->S9
            S4-->S7
            S5-->S7
            S6-->S7
            S7-->S10
            S10-->S9
            S9-->S8
        end
    end

My list of open issues:

  • place text outside the boxes and arrows
  • set all elements of the same type to a default size
  • place lanes side-by-side
  • pool and lane text (top or bottom, according to the diagram's layout)
  • default decision arrow (add slash at the beginning)
  • gateway symbols (empty, X, O, +)
  • task symbols (event, rule, service, manual, etc)
  • task borders
  • event symbols (message, timer, terminate, error, etc.)
  • event borders
  • sub-processes (inlined)
  • sub-processes (collapsing)
  • sub-processes (callable, external)
  • task and sub-processes marks (loop, parallel, etc.)
  • task events
  • notes and comments
  • inter-lane signals
  • other connector layout options (straight, curved, etc.)

Feel free to try more strategies in the example and complete the list

Inactive

Most helpful comment

Great suggestions!

It looks like the BPMN idea has not gained much traction. That's too bad... It would have been great to have this in mermaid.

All 5 comments

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

Great suggestions!

It looks like the BPMN idea has not gained much traction. That's too bad... It would have been great to have this in mermaid.

Still looking for BPMN diagrams :'(

Really wished Mermaid supported BPMN! Quite useful...

Agree that BPNM would be great. There is also an available library that could maybe be used: https://bpmn.io/ ?

Was this page helpful?
0 / 5 - 0 ratings

Related issues

visualcurrent picture visualcurrent  路  3Comments

init-dcat-ap-de picture init-dcat-ap-de  路  3Comments

vikram-rawat picture vikram-rawat  路  5Comments

erelling picture erelling  路  3Comments

deftdawg picture deftdawg  路  3Comments