标签：svg d3-js force-layout javascript

我想通过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

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。