Question

我正在尝试将OnClick事件添加到力布局图的节点中，但是当我尝试单击它们时，没有任何反应。我相信这是因为我没有使用svg元素而.on（“click”，click）仅适用于svg元素我认为但我不完全确定。以下是我要实现的代码：

var node = svg.selectAll(".node")
.data(nodes)
  .enter().append("circle")
.attr("r",function(d) {return d.size})
  .style("fill",function(d) {return color(d.type);})
.on("click", click)
  .call(force.drag);

  node.append("title")
  .text(function(d){return d.name;});

  force.on("tick", function(){
  node.attr("cx", function(d){return d.x;})
    .attr("cy", function(d) {return 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;});
});


function click() {
   d3.select(this).select("circle").transition()
     .duration(750)
     .attr("r", 30)
     .style("fill", "lightsteelblue");
      }

当我尝试单击某个节点时，没有任何反应。我不知道该怎么做。我认为问题与：

有关

.enter().append("circle")

我认为它需要是一个svg元素，如（“g”）或（“svg”），但我无法弄明白。任何建议或意见将不胜感激。谢谢！

Answer 1

.select("circle")中有额外的click()。相反，它应该始于：

function click(){
    d3.select(this).transition()...
}

将OnClick事件添加到D3强制布局图

1 个答案: