相关疑难解决方法(0)

如何使用D3对角线功能绘制曲线?

我查看了示例http://bl.ocks.org/mbostock/raw/4063570/:

在此输入图像描述

它从源到目标从左到右生成很好的合并线.

在我的情况下,我需要手动布局节点并放置x,y坐标.在这种情况下,线路不会在源节点处合并.以下是重现此问题的测试代码:

var data = [ {name: "p1", children: [{name: "c1"}, {name: "c2"}, {name: "c3"}, {name: "c4"}]}];
var width = 400, height = 200, radius = 10, gap = 50;

// test layout
var nodes = [];
var links = [];
data.forEach(function(d, i) {
    d.x = width/4;
    d.y = height/2;
    nodes.push(d);
    d.children.forEach(function(c, i) {
        c.x = 3*width/4;
        c.y = gap * (i +1) -2*radius;
        nodes.push(c);
        links.push({source: d, target: c});
    })
})

var color = d3.scale.category20();

var svg …
Run Code Online (Sandbox Code Playgroud)

javascript svg curve d3.js

19
推荐指数
2
解决办法
2万
查看次数

标签 统计

curve ×1

d3.js ×1

javascript ×1

svg ×1