如何为networkD3桑基图添加数字点击响应，返回节点标识

核心代码插入位置 #

要实现点击桑基图节点标识（如Mild_1、Mild_2）时返回节点ID并触发弹窗，需将Shiny.onInputChange('clickedNode', d.name)插入到clickJS函数的节点文本点击事件回调中，具体是在d3.selectAll(".node text")绑定的on("click")逻辑内。

完整可运行Shiny示例代码 #

library(shiny)
library(networkD3)
library(dplyr)

# 模拟患者数据
patient_data <- tibble(
  node_id = c(rep("Mild_1", 3), rep("Mild_2", 4), rep("Severe_1", 2)),
  patient_id = paste0("P-", 1:9),
  age = sample(20:70, 9),
  symptom = sample(c("Cough", "Fever", "Fatigue"), 9, replace = TRUE)
)

# 桑基图数据
links <- data.frame(
  source = c(0, 0, 1),
  target = c(1, 2, 3),
  value = c(3, 4, 2)
)

nodes <- data.frame(
  name = c("Initial", "Mild_1", "Mild_2", "Severe_1")
)

ui <- fluidPage(
  titlePanel("桑基图患者信息弹窗"),
  sankeyNetworkOutput("sankey_plot"),
  # 弹窗模态框
  modalDialog(
    title = "患者详细信息",
    tableOutput("patient_table"),
    footer = modalButton("关闭"),
    id = "patient_modal",
    easyClose = TRUE
  )
)

server <- function(input, output, session) {
  # 渲染桑基图，添加点击事件
  output$sankey_plot <- renderSankeyNetwork({
    clickJS <- '
    function() {
      d3.selectAll(".node text")
        .on("click", function(d) {
          // 插入返回节点标识的核心代码
          Shiny.onInputChange("clickedNode", d.name);
        });
    }
    '
    
    sankeyNetwork(
      Links = links,
      Nodes = nodes,
      Source = "source",
      Target = "target",
      Value = "value",
      NodeID = "name",
      fontSize = 14,
      nodeWidth = 30,
      onClick = clickJS
    )
  })
  
  # 监听点击事件，弹出模态框并渲染表格
  observeEvent(input$clickedNode, {
    node_id <- input$clickedNode
    # 过滤对应节点的患者数据
    filtered_data <- patient_data %>% filter(node_id == !!node_id)
    
    output$patient_table <- renderTable(filtered_data)
    
    # 显示模态框
    showModal(modalDialog(id = "patient_modal"))
  })
}

shinyApp(ui, server)

关键说明 #

• clickJS函数中，d3.selectAll(".node text")选中所有节点的文本元素，在其点击回调内插入Shiny.onInputChange('clickedNode', d.name)，即可将点击的节点名称传递给Shiny服务器端。
• 服务器端通过observeEvent(input$clickedNode)监听输入值变化，过滤对应节点的患者数据后渲染表格，并触发模态框显示。

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