Question

我想通过d3力布局可视化一些数据。

但是，连接节点的链接是直线。但数据可能有多个边连接两个节点。如此直线强制布局无法正确显示所有这些。我试图追加链接而不是行的路径。但它没有用。我不知道是否因为我以错误的方式或强迫使用它布局不接受路径作为链接。

Answer 1

使用svg：行第二行的路径

var viz = d3.select("body")
    .insert("svg:svg", "h2")
    .attr("width", "100%")
    .attr("height", "100%")

。。。。。。。

    .append("svg:path")
    .attr("d", "M0,-5L10,0L0,5");

var path = svg.selectAll("path").data(force.links()).enter()
                .append("svg:path").attr("source", function(d) {
                    return d.source.id;
                }).attr("target", function(d) {
                    return d.target.id;
                }).attr("class", "link").attr('marker-end', 'url(#head)');

此处来源和目标是节点，曲线在' d '属性中指定strong> svg：path '和 marker-end 属性适用于箭头

在d3力导向图中使用曲线

1 个答案: