I have to create the nodes and edges, having interconnections. I am using d3 js for the same. Now the problem is that the graphs look so much messy. I tried using quadratic bezier curves to draw the edges between the nodes. I want that If a press a button it should rearrange into simplified view.
I happened to look at metacademy, they are a open source project. Which have the exact functionality I am looking for. https://metacademy.org/graphs/edit/new, you would need to login. However not able to find their part of code which is doing the same.
Initially created graph
After pressing the refresh button
I am pretty new to d3js, so I will be thankful for any help/suggestions.
I see this is a pretty old question, but FWIW, I designed the graph you're referring to.
Getting graphs to organize so that it minimizes edge crossing is an area of active research. For metacademy, I integrated d3.js + dagre https://github.com/dagrejs/dagre