BPMN pool with message flow
Two pools (Customer / Vendor) with message arrows crossing between them.
Rendering…
Make it your own.
{
"nodes": [
{ "id":"p1","type":"container","label":"Pool: Customer","x":40,"y":40,"width":1100,"height":200,"fill":"rgba(219,234,254,0.45)","stroke":"#2563eb" },
{ "id":"p2","type":"container","label":"Pool: Vendor","x":40,"y":260,"width":1100,"height":200,"fill":"rgba(254,243,199,0.45)","stroke":"#a16207" },
{ "id":"s1","type":"ellipse","label":"Place order","x":120,"y":110,"fill":"#dbeafe","stroke":"#2563eb" },
{ "id":"t1","type":"rounded","label":"Receive invoice","x":320,"y":110,"fill":"#dbeafe","stroke":"#2563eb" },
{ "id":"t2","type":"rounded","label":"Pay invoice","x":540,"y":110,"fill":"#dbeafe","stroke":"#2563eb" },
{ "id":"e1","type":"ellipse","label":"Order received","x":820,"y":110,"fill":"#dcfce7","stroke":"#15803d" },
{ "id":"s2","type":"ellipse","label":"Accept order","x":120,"y":330,"fill":"#fef3c7","stroke":"#a16207" },
{ "id":"t3","type":"rounded","label":"Send invoice","x":320,"y":330,"fill":"#fef3c7","stroke":"#a16207" },
{ "id":"t4","type":"rounded","label":"Ship goods","x":540,"y":330,"fill":"#fef3c7","stroke":"#a16207" },
{ "id":"e2","type":"ellipse","label":"Closed","x":820,"y":330,"fill":"#dcfce7","stroke":"#15803d" }
],
"edges": [
{ "id":"a","source":"s1","target":"t1" },
{ "id":"b","source":"t1","target":"t2" },
{ "id":"c","source":"t2","target":"e1" },
{ "id":"d","source":"s2","target":"t3" },
{ "id":"e","source":"t3","target":"t4" },
{ "id":"f","source":"t4","target":"e2" },
{ "id":"m1","source":"s1","target":"s2","label":"order →","animated":true,"className":"lf-flow-edge" },
{ "id":"m2","source":"t3","target":"t1","label":"← invoice","animated":true,"className":"lf-flow-edge" },
{ "id":"m3","source":"t2","target":"t4","label":"payment →","animated":true,"className":"lf-flow-edge" }
]
}