d3.js - 将链接大小设置为强制布局

标签 d3.js force-layout

基于 Michael Bostock 的“Molecule”示例,可通过以下网址获取:http://bl.ocks.org/mbostock/3037015 .

我正在尝试使用多个值设置链接的大小。为此,我禁用了“重力”,在“电荷”中放置了一个重要的负值,并将第一个节点固定在窗口的中心。

var force = d3.layout.force()
    .size([width, height])
    .charge(-800)
    .friction(0.45)
    .linkStrength(1)
    .gravity(0)
    .linkDistance(function(d) { 
        return radius(d.target.size * 10);
     });

我的问题是( as you can see on the image below )有时链接的大小不同,特别是对于定义了很小值的链接。

有人知道解决我的问题的一个好方法吗?

您可以在这里看到我的代码:http://jsfiddle.net/awPn3/

最佳答案

链接的长度是可变的,这是力布局的一个特点——重点是节点是自动布局的,你不必担心它。您可以实现检查来确保距离始终是您想要的距离,但这将非常困难。

您已经使用的 linkDistance 函数是(弱地)强制执行此类约束的唯一直接方法。如果这还不够,那么就没有简单的方法来缓解它。您唯一的选择是在模拟的每个周期执行我上面提到的检查。

关于d3.js - 将链接大小设置为强制布局,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16216630/

相关文章:

javascript - 使用 D3 逐节点构建图

javascript - 力布局中的d3动态曲线

javascript - D3 中的 "Progress dots",Wolfram 风格

javascript - d3.js 强制定向布局受形状约束

javascript - d3.js 同一页面中多个元素上的可重用图表

javascript - Nvd3 : How prevent to display chart between -1 and 1 if have all y values 0?

javascript - 鼠标悬停时显示框

javascript - 如何在 D3 Javascript 中绘制一个简单的力导向图

javascript - 设置 d3 图表的 y 轴以适合最宽的标签?

javascript - D3 从字符串中解析数字