Generate complex diagrams progrmitacally from custom json

we have our custom json data which defines activities and their relationships in our repository, Based on our data we need to generate complex swim lane diagrams and render on browser. I understand we might need to use bpnm-moddle or elementFactory and add nodes programatically.

but, i see 2 complexities with this

  1. Identifying coordinates of each shape dynamically
  2. Identifying path of connectors and define coordinates of each turn of connector

Please let me know if my assumption of defining coordinates is wrong in above 2 scenarios

I see in below forum coordinates are hardcoded, So i assumed i have responsibility to define coordinates of all shapes.

What you see here are the default sizes for each element type, in case these and the coordinates of an element are not given via attributes. In bpmn-js we always try to get the coordinates of an element via the diagram interchangeability (DI) information, which can be stored in a bpmn file or wherever you get your data from.

Generally saying, we have no auto-layout functionality as for now to fill out this general information. What we do in some cases is to auto-align connections and attached elements, e.g. via BpmnLayouter and AutoPlace. But you will have to more or less define the general positioning information yourself