所以,我在这里提出另一个问题: 我在D3中设置了一个网络。它的节点都是不固定的,但只有一个。所有未固定的都可以拖动到任何你想要的地方,但在svg内。为此,我测试脚本末尾的新坐标。但是,如果我移动固定节点,则所有其他节点都与此节点一起拖动。 我的问题是,节点似乎得到了相对于父对象的坐标,在这种情况下,父对象是一个提供组拖动的g元素。所以在拖动之后他们仍然有限制,但他们与团队一起转移。任何有用的提示欢迎:) 这是我的代码的一部分:
var node = group.selectAll(".node")
.data(reqNodes)
.enter().append("g")
.attr("transform", function(d) { return "translate(0,0)"; })
.attr("class", function(d) {
return d.fixed ? 'node fixed' : 'node not-fixed';
})
var CurrentGTransformX = 0;
var CurrentGTransformY = 0;
group.selectAll('.not-fixed')
.call(force.drag);
// attach a different drag handler to the fixed node
var groupDrag = d3.behavior.drag()
.on("drag", function(d) {
// mouse pos offset by starting node pos
var x = window.event.clientX - 420,
y = window.event.clientY - 260;
group.attr("transform", function(d) { return "translate(" + x + "," + y + ")"; });
//that was the line getting in conflict with the part in the end
CurrentGTransformX = x;
CurrentGTransformY = y;
});
group.call(groupDrag);
force.on("tick", function() {
node.attr("cx", function(d) { return d.x = Math.max(15, Math.min(width - 15, d.x)); })
.attr("cy", function(d) { return d.y = Math.max(15, Math.min(height - 15, d.y)); });
link.attr("x1", function(d) { return d.source.x; })
.attr("y1", function(d) { return d.source.y; })
.attr("x2", function(d) { return d.target.x; })
.attr("y2", function(d) { return d.target.y; });
node.attr("transform", function(d) { return "translate(" + d.x + "," + d.y + ")"; });
});
编辑:组的转换是为什么限制到底得到的其他数据比显示的。知道如何以正确的方式提供这两种功能吗?