D3 js складная диаграмма, увеличивающая радиус кривой дуги

Question

Я новичок в D3js. Я показываю json в сбрасываемом дереве. Дерево отображается отлично, но линии, соединяющие узлы, в основном прямые. Как управлять радиусом дуги, соединяющей узлы? Пожалуйста, дайте мне знать, как это сделать в d3js.

JSON данные, которые должны быть нанесены на d3

var treeData = JSON.parse('{"name":"pradeep","age":40, 
     "children": [{ 
      "name": "naveen", 
      "description": 20, 
      "children": [{ 
       "name": "interest", 
       "description": "displays the hobbies list", 
       "hobby": "S", 
       "hobby_name": "singinh" 
      }, { 
       "name": "profession", 
       "description": "describes the profession", 
       "profession": "blogger", 
       "salary": 20000, 
       "children": [{ 
        "name": "cars", 
        "description": "car collections", 
        "children": [{ 
         "name": "car-collections", 
         "description": "collections of cars", 
         "car_name": "audi", 
         "car_number": "8080" 
        }] 
       }] 
      }] 
     }] 
    }'); 

Прикрепленный в ссылке рабочий plunker - Plunker

Answer 1

Вертикальное разделение устанавливается магическим числом в коде, есть даже прокомментируйте это:

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

Вы можете настроить это значение или создать для него динамическое правило.

Вот ваш plunker с помощью 200: http://plnkr.co/edit/lmy7R5S6fH3kF69VT9zS?p=preview