3d-force-graph icon indicating copy to clipboard operation
3d-force-graph copied to clipboard

Arrange groups of nodes as intersecting rings

Open nathanturczan opened this issue 3 years ago • 5 comments

Using this CodePen for example:

https://codepen.io/nathanturczan/pen/OJWrRXj

I would like to arrange all of the Bart nodes in a ring, all of the Lisa nodes in a ring, and all of the Skinner nodes in a ring. Some nodes have connections to nodes in other groups, but I would like to maintain the rings' basic circular shape. The rings can be on different 2d axes, but it's important to my use case to show the groupings in this way.

nathanturczan avatar Apr 22 '21 21:04 nathanturczan

@nathanturczan you could perhaps try to achieve that with forceRadial.

You can have 3 different forceRadial added to the system, one for each group, with its own center and radius. You can make each force applicable to only the nodes of its given group by setting the strength to 0 if the node doesn't belong in that group.

vasturiano avatar Apr 22 '21 23:04 vasturiano

@vasturiano thank you for your response, this approach seems promising!

I'm not entirely sure how I would go about using the forceRadial functionality of d3-force-3d in the context of this project that's built with your 3d-force-graph component.

Do you suggest I re-build the project using only d3-force-3d?

nathanturczan avatar Apr 22 '21 23:04 nathanturczan

Ah, I see now that d3-force-3d is part of 3d-force-graph's underlying physics engine, so I'm sure I will be able to use forceRadial in the context of 3d-force-graph. Thank you again!

nathanturczan avatar Apr 22 '21 23:04 nathanturczan

I think that the way to do it is like this, but I'm not sure as I have not added custom forces before.

@vasturiano Could you add an example importing custom forces?

RaulPROP avatar Apr 23 '21 10:04 RaulPROP

@RaulPROP there are some in the nodes collision example: https://github.com/vasturiano/3d-force-graph/blob/master/example/collision-detection/index.html#L35-L47

The way you've added it in your codepen looks right though. In addition, if you want to arrange them like circles on a plain, perhaps you can fix the Z dimension with fz attributes on the nodes.

A different approach to the whole case could also be using clustering forces, using d3-force-cluster-3d.

vasturiano avatar Apr 23 '21 10:04 vasturiano