Customized cyclic diagram

[vincenzagiunco]

Hello. I would like to know if visx is suitable to achieve a result similar to these diagrams.
First important requirement is having the so called 'ports' (in and out) on each node, on which each link is anchored.
Second one is that the data in diagram can be cyclic.
What I did until now is use forceSimulation from d3-force to build properly the nodes and links objects (with x and y ) used to render the nodes linked by the LinkHorizontalStep component. To be honest I'm not sure this is the proper way to achieve my goal, because I don't really need to interact with the diagram nor to animate it.
Many thanks in advance

[williaster]

Hi @vincenzagiunco 👋 thanks for checking out visx. Currently we don't have any package that handles layout of cycle-containing data (@visx/hierarchy has trees + links + dendrograms, but those don't support cycles). Our @visx/network package also doesn't handle layouts which is the hardest part of a network vis.

I think your approach using d3-force is reasonable, even if you don't need animation / interactivity, it is doing the layout for you. Without that you'd need some other JS library that can compute the layout for you, and then you could use Link components to render them as you are doing now.

[vincenzagiunco]

Thanks @williaster for your quick reply. Let's suppose to use d3-force.
Does visx allow having those ports on each node to anchor the links?

Thanks