如何将networkD3节点点击重定向至基于值的动态URL？

当然可行！虽然networkD3官方示例里没有直接展示这个功能，但它本质是基于D3.js的HTML小部件，我们可以通过注入自定义JavaScript代码轻松扩展节点的交互行为，实现点击跳转链接的需求。下面给你一个完整的实现示例：

完整代码示例 #

library(networkD3)
library(magrittr)
library(htmlwidgets)

# 1. 准备包含URL信息的节点数据
nodes <- data.frame(
  name = c("A", "B", "C", "D"),
  # 给每个节点分配对应的跳转链接
  url = c("https://example.com/a", "https://example.com/b", 
          "https://example.com/c", "https://example.com/d")
)

# 2. 准备边数据（和你原来的结构一致）
links <- data.frame(
  source = c(0, 0, 0, 1),
  target = c(1, 2, 3, 2),
  value = c(1, 2, 3, 1)
)

# 3. 生成基础的力导向网络图
p <- forceNetwork(
  Links = links,
  Nodes = nodes,
  Source = "source",
  Target = "target",
  Value = "value",
  NodeID = "name",
  opacity = 0.8
)

# 4. 注入自定义JS代码，实现点击跳转
p %>% onRender("
  function(el, x) {
    // 选中所有节点元素，绑定点击事件
    d3.select(el).selectAll('.node')
      .on('click', function(event, d) {
        // 打开对应URL，_blank表示在新窗口打开
        window.open(d.url, '_blank');
      })
      // 鼠标悬停时显示指针光标，提示可点击
      .style('cursor', 'pointer');
  }
")

关键说明 #

• 节点URL存储：在nodes数据框中新增url列，把每个节点对应的跳转链接存在这里，D3.js会自动读取这个字段；
• 自定义交互逻辑：通过htmlwidgets::onRender函数注入D3.js代码，给所有.node类的元素绑定点击事件，触发window.open打开链接；
• 跳转方式调整：如果想在当前窗口跳转，把代码中的'_blank'替换为'_self'即可；
• 其他图表类型适配：如果你用的是sankeyNetwork或其他networkD3图表，只需要调整节点选择器（比如桑基图的节点选择器是.node rect），核心逻辑完全一致。

注意事项 #

如果你把生成的HTML文件本地打开后点击没反应，大概率是浏览器的本地文件安全限制导致的，把HTML部署到服务器上或者用RStudio的Viewer面板查看，就能正常触发跳转啦~

内容的提问来源于stack exchange，提问作者Dmitry Kholodkov