D3 Js Collapsible Chart Increasing The Arc Curve Radius

I am new to D3js. I am displaying the json in collapsible tree. The tree is displaying fine but the lines connecting the nodes are mostly straight. How to control the radius of the

Solution 1:

The vertical separation is set by a magic number in your code, there is even a comment on it:

var newHeight = d3.max(levelWidth) * 25; // 25 pixels per line

You can tweak this value or create a dynamic rule for it.

Here is your plunker using 200: http://plnkr.co/edit/lmy7R5S6fH3kF69VT9zS?p=preview