Question

我正在使用以下代码在d3.js图表中移动节点：

d3.select("#"+ nodeid).attr("x",x);
d3.select("#"+ nodeid).attr("y",y);

这样可以正常工作，但是当我再次开始拖动节点时，它会“跳回”到原来的位置并从那里开始移动。

我在这里做错了什么想法？

Answer 1

您正在更新DOM元素（图形），但不更新基础数据，并且dragstart事件正在使用仍存储在数据中的原始位置。

尝试这样的事情：

force.setNodeCoords = function (id, x, y) {
    var fnodes = force.nodes();
    fnodes[id].x = x;
    fnodes[id].y = y;
    force.nodes(fnodes);
    svg.selectAll("circle.node")
        .attr("cx", function(d) { return d.x; })
        .attr("cy", function(d) { return d.y; });
};

（其中svg是您的SVG或其他父div，而node是您的节点类）

您可能还想更新线路/链接！

Answer 2

我最后只是将其添加到代码中

d3.select("#"+ nodeid).data([{x: x, y: y}]);

d3js在不拖动的情况下移动节点

2 个答案: