I’m currently working a javascript project about user interface related to status of servers. I have a main node, which all nodes connected to, and some nodes. Number of nodes can be any, say between 5 and 50. I want them auto-fitted and the main node should be placed in the middle. Please click the link.
As you see in the figure, all nodes connected to main node, plus their sizes and positions are arranged to fit in the view.
Is there any library, example or a code snipplet that I can use?
– or –
Any suggestions about how I can construct this?
Edit: I’m simply asking, is there any algorithm that I can fit some number of objects into the screen?
PS: sorry about tags, I couldn’t decide what to put.
As always, the best way is the way you know. So I’ve implemented an algorithm that fits all nodes by keeping the distance almost the same using some simple physics forces. And the main node is always around the center. Here is the jsfiddle. Try something between 5 and 50. Works mostly well but sometimes, bug occurs.