Question

今天的问题是d3.drag()功能。我不太了解simulation.alpha值。

我面临以下问题：我想拖动我的节点。以下是代码的一小部分：

var node = d3.select("svg").selectAll("circle")
             .data(nodes).enter().append("circle")
             .call(d3.drag().on("start", dragstart)
                            .on("drag", dragged)
                            .on("end", dragend));

function dragstart(d){
    //If i delete the following line, my simulation stops after some time.
    if (!d3.event.active) simulation.alphaTarget(0.3).restart();
    d.fx = d.x;
    d.fy = d.y;
};

就像我在评论中所说，如果我不重新启动alphaTarget，拖动会在几秒后停止。有人能够解释这种现象吗？

这是我完整的JSFiddle：https://jsfiddle.net/FFoDWindow/zwtzq8rj/2/

Answer 1

一个小时前遇到了同样的问题。

可能您在tick函数中具有了渲染逻辑。如果希望能够在不重新启动仿真的情况下拖动元素，则应实现渲染功能（告诉元素从数据的x和y设置其位置）。然后将render函数调用添加到您的“拖放”函数

function dragged(d) {
    d.x = d3.event.x;
    d.y = d3.event.y;
    render();
}

您还可以将tick（）函数更改为类似的内容

function tick(){
    render();
}

不是最有效的方法，但对我有用。

如果您还希望在拖动后也开始仿真，那么您的实现是正确的。

d3.drag在几秒钟后停止

1 个答案: