协调限制

时间:2013-02-06 13:17:32

标签: javascript d3.js coordinates draggable

所以,我在这里提出另一个问题: 我在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 + ")"; });
});

编辑:组的转换是为什么限制到底得到的其他数据比显示的。知道如何以正确的方式提供这两种功能吗?

0 个答案:

没有答案