D3物理重力

我试图用D3库设计一个物理重力模拟,但我没有很多运气。 “布局”API参考指出,物理重力可以通过积极的“充电”参数实现,但我不确定这将如何工作。

我现在试图实现的是单个SVG元素,它包含多个以不同速度上升并最终离开视口的多个可变加权和大小的矩形 - 它们的权重将定义它们上升的速度。 (基本上,我只是试图从视口顶部实现全局引力拉。)

按照D3的力量布局有没有可行的方法? 我只是在寻找概念上的解决方案,但是我们也赞赏示例和代码片段。

提前致谢!


这里有几个想法:

  • 您可以直接在tick事件处理程序中修改节点的垂直位置:

    force.on("tick", function(e) {
        nodes.forEach(function(o, i) {
            o.y -= o.weight / 30;
         });
    
         node.attr("cx", function(d) { return d.x; })
             .attr("cy", function(d) { return d.y; });
    });
    

    您需要为此方法设置force.gavity(0)。

  • 或者您可以使用force.gravity:它将节点拉向布局中心,您可以指定svg transfromation以在视口上方移动布局中心
  • 链接地址: http://www.djcxy.com/p/11213.html

    上一篇: D3 physical gravity

    下一篇: Foreign key with multiple columns from different tables