2

我正在尝试在 d3 力图中启用拖动行为,以便可以单击背景(不是节点或链接)并拖动(平移)整个图形,但也可以独立单击并拖动节点(无需平移整个图形)。虽然我可以让每个单独工作,但当我组合代码时,背景矩形似乎覆盖了节点,因此我不能再拖动节点而不拖动整个图形。我在下面包含了两个相关的代码,非常感谢任何帮助!

这段代码让我可以平移和缩放整个图表:

vis = d3.select("#chart")
.append("svg:svg")
    .attr("width", w)
    .attr("height", h)
    .append("svg:g")
    .call(d3.behavior.zoom().on("zoom", redraw))
    .append("svg:g");

此代码允许我拖动并单击一个节点 - 但仅当不包含上述代码时:

      var node = vis.selectAll("circle.node")
      .data(json.nodes)
    .enter().append("svg:circle")
      .attr("class", "node")
      .attr("cx", function(d) { return d.x; })
      .attr("cy", function(d) { return d.y; })
      .attr("r", 6)
      .style("fill", function(d) { return groupColors[(d.group)-1]; }) // fill(d.group)
      .on("click", function(d) {
            node.style("stroke","#FFFFFF");
            d3.select(this).style("stroke","red");
            clickNode(d);
            })
      .call(force.drag);
4

0 回答 0