javascript - 在 Networkd3 Sankey Chart (R/Shiny) 中返回节点名称

Question

我的 R/Shiny 应用程序中有一个 networkd3 Sankey 图，它从 MySQL 连接中提取数据。我正在尝试找到一种“向下钻取”图表的方法-单击一个节点，这将返回该节点的名称。然后，我将使用它向数据库传递另一个查询，该数据库将在应用程序中填充一个表。

这就是我所拥有的 -

san <- sankeyNetwork(Links = sanData, Nodes = nodes, Source = "source",
    Target = "target", Value = "value")

这绘制了工作正常的图表。

这是我迄今为止尝试过的 -
使用R包htmlwidgets ，并在我的 sankey 图表上使用 onRender 运行以下 JS 脚本。

JS 脚本的占位符:

clickFun <- 'd3.selectAll(".link").on("click",function(d) {alert(d.value);})'

在我的 sankey 输出中:onRender(san, clickFun)
这会将链接的值作为警报返回。我尝试使用 ".node"和 d.data.name正如其他一些示例所建议的那样，但我无法让它工作并且没有弹出警报。

这是我的问题:
1.如何在鼠标点击时从桑基图中检索节点的名称？
2.假设我已经实现了上述，我如何在我的 Shiny 应用程序中使用我的 JS 脚本返回的值？我将更改 alert()位到 return() ，但我不知道如何在我的服务器应用程序中使用它。

Answer 1

您的 click 事件在链接上起作用但在节点上不起作用的原因是因为节点还具有附加到它们的拖动行为。解决这个问题的最简单方法是取消拖动行为，然后添加点击行为，就像这样......

library(networkD3)
library(htmlwidgets)

URL <- paste0('https://cdn.rawgit.com/christophergandrud/networkD3/',
              'master/JSONdata/energy.json')
energy <- jsonlite::fromJSON(URL)

san <- 
  sankeyNetwork(Links = energy$links, Nodes = energy$nodes, Source = 'source',
              Target = 'target', Value = 'value', NodeID = 'name',
              units = 'TWh', fontSize = 12, nodeWidth = 30)

clickFun <- 
  'function() { 
      d3.selectAll(".node").on("mousedown.drag", null);
      d3.selectAll(".node").on("click",function(d) { alert(d.name); })
   }'

onRender(san, clickFun)

这是一个工作示例，其中 onclick 事件返回单击节点的名称，然后将其传递给处理 SQL 命令并将结果返回给数据表命令的 R 函数，该命令显示从该节点跟随的链接...

library(shiny)
library(networkD3)
library(DT)
library(sqldf)
library(htmlwidgets)

URL <- paste0('https://cdn.rawgit.com/christophergandrud/networkD3/',
              'master/JSONdata/energy.json')
energy <- jsonlite::fromJSON(URL)

energy$links$name <- energy$nodes$name[energy$links$source + 1]
df <- energy$links

funct <-
  function (n) {
    isp <- sprintf("Select * From df Where df.name='%s';", n)
    isd <- sqldf::sqldf(isp)
    return(isd)
  }

ui <- shinyUI(fluidPage(
  fluidRow(
    column(4, sankeyNetworkOutput("sankey")),
    column(4, DT::dataTableOutput("table"))
  )
))

server <- shinyServer(function(input, output, session) { 
  session$onSessionEnded(stopApp)
  output$sankey <- renderSankeyNetwork({
    san <- 
      sankeyNetwork(Links = energy$links, Nodes = energy$nodes, Source = 'source',
                    Target = 'target', Value = 'value', NodeID = 'name',
                    units = 'TWh', fontSize = 12, nodeWidth = 30)

    clickFun <- 
      'function() { 
          d3.selectAll(".node").on("mousedown.drag", null);
          d3.selectAll(".node").on("click",function(d) { Shiny.onInputChange("id", d.name); });
        }'

    onRender(san, clickFun)
  })

  output$table <- DT::renderDataTable(DT::datatable(funct(input$id)))
})

shinyApp(ui = ui, server = server)