D3 js可折叠图表增加弧形曲线半径

时间:2016-09-14 13:47:37

标签: javascript jquery json d3.js

我是D3js的新手。我在可折叠树中显示json。树显示正常,但连接节点的线大多是直的。如何控制连接节点的弧的半径?请让我知道如何在d3js中执行此操作。

需要在d3上绘制的json数据

  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

1 个答案:

答案 0 :(得分:1)

垂直分隔由代码中的幻数设置,甚至还有一个注释:

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

您可以调整此值或为其创建动态规则。

以下是使用200http://plnkr.co/edit/lmy7R5S6fH3kF69VT9zS?p=preview

的傻瓜