链接D3.js力布局网络的阈值函数中的笔划宽度

Links stroke-width in threshold function for D3.js force-layout network

本文关键字：函数 阈值 js 布局 网络 链接 D3      更新时间：2023-10-30

我目前正在使用D3库进行网络可视化，更准确地说是部队布局。

我在这里使用Simon Raper提供的功能：

http://jsfiddle.net/simonraper/TdHgx/?utm_source=website&utm_medium=嵌入&utm_campaign=TdHgx

在我的网络上应用动态阈值。

然而，我注意到一个问题，当阈值改变时，网络的笔划宽度显示不正确。即使在Raper先生的例子中，你也可以看到链接的笔划宽度无缘无故地变化。

快速查看控制台，我发现这些值是正确的，网络的形状也是正确的，只是链接的笔划宽度显示是错误的。这似乎是一个索引问题，因为不正确的值不是随机的，而是与其他链接相对应的。

我能找到的最好的替代品是：

link=link.data(graph.links);

通过

link = link.data(force.links(), function(d){return d.source.name + "-" + d.target.name; });

在重新启动功能中。

链接的笔划宽度现在是正确的，但当这样做时，链接有时会不可见…

如果任何对D3库更有经验的人能提供帮助，我将不胜感激；）

应该是：

link.data(force.links(), function(d){return d.source + "-" + d.target; });

没有d.source.name或d.target.name

此处为工作代码

编辑

在滑动门槛时。正在进行节点筛选，这就是链接未显示的原因。

function threshold(thresh) {
    //clearing up links
    graph.links.splice(0, graph.links.length);
    //only selecting and pushing links with value > threshold.
        for (var i = 0; i < graphRec.links.length; i++) {
            if (graphRec.links[i].value > thresh) {graph.links.push(graphRec.links[i]);}
        }
    restart();
}
相关文章：