d3js Force Network：Ctrl-单击节点到外部链接？

Question

我有一个简单的力网络图，我想使用 ctrl-Click 来允许导航到外部 URL。在此处查看 JS Fiddle：

https://jsfiddle.net/NovasTaylor/o1qesn6k/

我成功地在 on click 事件下使用 d3.event.ctrlKey 为所有节点硬编码了一个链接，如下所示：

 var nodes = svg.selectAll("g.node")
                 .data(dataset.nodes)
                 .enter()
                 .append("g")
                 .attr("class", "node")
                 .on("dblclick", dblclick)
                 .on("click", function () {
                     if (d3.event.ctrlKey) {
                     location.href = 'http://www.google.com';
                     }
                  })
                 .call(drag);

相反，我想使用为源数据中的每个节点指定的 URL 作为 d.url （请参阅小提琴 - 该值可用于节点“B”）。

我已经看到一些关于使用标签编码的参考资料，但无法获得点击事件以触发到 URL 的导航。目标 URL 应在同一窗口中打开，替换强制网络图。

您的帮助将不胜感激。

干杯，

蒂姆

更新：根据 Lars 的建议，解决问题的代码是：

  var nodes = svg.selectAll("g.node")
      .data(dataset.nodes)
      .enter()
      .append("g")
      .attr("class", "node")
      .on("dblclick", dblclick)
      .on("click", function (d) {
         if (d3.event.ctrlKey) {
          location.href = d.url;
      }
  })

Answer 1

D3 中几乎所有的回调函数都将绑定到元素的数据作为参数。您可以在函数定义中引用它并动态设置值。在你的情况下，这将是

.on("click", function (d) {
     if (d3.event.ctrlKey) {
      location.href = d.url;
  }