search

vasturiano / react-force-graph

React component for 2D, 3D, VR and AR force directed graphs
https://vasturiano.github.io/react-force-graph/example/large-graph/
MIT License
2.25k stars 284 forks source link

Q: Group nodes by label #330

Open csansz opened 2 years ago

csansz commented 2 years ago

Hi!

Is it possible to group nodes on the screen by labels?

For example all of the nodes with label X located in the top right corner, nodes with label Y are in the middle and so on.. The location of the nodes is not important, only the grouping is necessary for me. I don't know if it's solvable or if there's any option to do that.

My graph has circles so I cannot use DAG mode.

Thank you for your answer.

JonThom commented 2 years ago

@csansz jumping in here. Pretty sure the library has no built-in ways to lay out nodes in clusters. You can set the node coordinates whichever way you want by updating each node'sfx, fy or x, y props. One solution would be to use a layout library to compute force layouts for each label separately, and then arrange each label cluster a different place on the canvas.

vasturiano commented 2 years ago

In addition to what @JonThom mentioned, you can also try using a clustering force plugin to help you with some of the layout computation, like d3-force-cluster: https://github.com/ericsoco/d3-force-cluster or the 3D counterpart: https://github.com/vasturiano/d3-force-cluster-3d

duhmojo commented 2 years ago

@csansz jumping in here. Pretty sure the library has no built-in ways to lay out nodes in clusters. You can set the node coordinates whichever way you want by updating each node'sfx, fy or x, y props. One solution would be to use a layout library to compute force layouts for each label separately, and then arrange each label cluster a different place on the canvas.

Are you suggesting to use a different library altogether, or a different layout algorithm from another library?