javascript-在d3力向图中使用曲线
作者:互联网
我想通过d3强制布局可视化一些数据.
但是,连接节点的链接是直线.但是数据
可能具有连接两个节点的多个边.所以直线
强制布局无法正确显示所有这些.我试图追加
链接而非路径的路径.但这没有用.我不知道
是否是因为我以错误的方式或用力使用它
布局不接受路径作为链接.
解决方法:
使用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)');
这里源和目标是结点,在’svg:path’的’d’属性中指定的曲线,而marker-end属性用于箭头
标签:svg,d3-js,force-layout,javascript 来源: https://codeday.me/bug/20191201/2078848.html