Hi I am trying to create an new event and connect it to existing gateway. Looks like I am doing something wrong because shapes are created but diagram xml looks wrong.
here is code bpmn-js Sandbox (forked) - CodeSandbox
Run, click connect and click export after to see generated xml on console.
See that it creates shape with empty dc:Bounds object.
<bpmndi:BPMNShape id="Event_126g3wh_di" bpmnElement="Event_126g3wh">
I see that in your codesandbox, we use
canvas to directly add shapes on canvas. This won’t work if you want to export XML afterwards. What you should do instead is to use the Modeling API.
Fortunately, there is a great example which should direct you in the right way. Please check out bpmn-js-examples/modeling-api at master · bpmn-io/bpmn-js-examples · GitHub
Thanks a lot. I moved to modeling API and it is so easy.
I am wondering:
- If you have a documentation outline the different API and their difference.
- When I add a new event I have to set up x and y for it. How can I identify an empty space on canvas with a specified distance to a gateway to what I want to connect the new event?
If you have a documentation outline the different API and their difference
I like to point to this guide and graphic that explains the difference between
bpmn-js and goes over which modules belong where.
How can I identify an empty space on canvas with a specified distance to a gateway to what I want to connect the new event?
not directly, but you can use the
autoPlace feature to specify an element you want to append the shape to. The code would look like this: