Simple Node Visualization with Diagram.js

Developers General
1

Hello everyone :grinning:,

First of all great project and website!

I just started out with diagram.js especially. My task is to implement a simple Visualization of Nodes with a name and a parent-children relation, where children can be connected by a link:

diagramjs

As you can see a node can have (0…*) children, where the Leaf children are connected. (Composite pattern) I get all the input nodes as json and my app has to visualize it to the user.
How would I manage this via diagram.js ?

So far with your example I managed to add Shapes via the ElementFactory. But does diagram.js provided me with any help regarding:

  • giving each shape a name
  • the parent-child structure, as seen above
  • the connection of the leaf nodes
  • the composition of children inside the parent node (like in a masonry, masonry-fashion)

Any pointers are highly appreciated! :see_no_evil:

1 Like
2

Also can this be achieved simply by utilizing the bpmn viewer and feeding it a parsed XML that generates the desired outcome?

3

Did you manage to achieve the above? Also looking to do something similar

4

Please do not necrobump old topics. Instead link to this thread from new topic.