Javascript 将networkD3中节点上的clickAction链接到选项卡中的内容预览

是否有一个选项可以使用

forceNetwork

节点中的

clickAction

预览网格旁边面板中该节点的特定数据？我已经设法使

clickAction

调用一个指向特定站点的超链接，但我想改变这一点，以便单击节点只在屏幕右侧显示一些数据，而不退出现有屏幕

以下是带有超链接的代码：

library(shiny)
library(networkD3)

source =c(0,0,1,1,1,
      1,1,2,1,9,
      9,9,8,8,1,
      15,15,2,2,8)

target = c(1,2,3,4,5,
       6,7,8,9,10,
       11,12,13,14,15,
       16,17,18,19,20)

value = c(500,500,500,500,10,
      10,10,10,10,10,
      10,10,10,10,10,
      10,10,10,10,10)
MisLinks = data.frame(source,target,value)


name = c("spellsouls", "product","market", "flow", "progression",
     "guilds", "leaderbords","core mechanic", "audience", "live 
issues",
     "ux", "gd", "art", "personas", "TAM",
     "champions", "art","gd","videos","communication",
     "audience book")
group = c(1,2,2,3,3,
      3,3,3,3,3,
      4,4,4,4,4,
      3,4,4,4,4,
      4)
size = c(300,100,100,5,5,
     5,5,5,3,3,
     3,3,3,5,3,
     3,3,3,3,3,
     3)
hyperlink = c("https://confluence.hq.nordeus.com/x/SqwRAw", 
"http://yahoo.com", "http://google.com", "http://yahoo.com", 
"http://google.com") #can't add more link in preview

MisNodes = data.frame(name, group, size, hyperlink)


ui = fluidPage(theme = "bootstrap.css",
           headerPanel(
             "Game perception: Knowledge base"),
           tabsetPanel(
             tabPanel("insights universe",
                      tags$head(tags$style("#force{height:100vh 
!important;}")),
                      forceNetworkOutput("force")),

             tabPanel("help", 
                      h1("User universe", align = "center"),
                      br(),
                      br(),
                      br(),
                      h4("This is a visual representation of our 
knowledge about Spellsouls", align = "center"),
                      h4("To read into more feedback we got for every 
specific feature of the game,", align = "center"),
                      h4("simply click on any node in the network", 
align = "center")
             )
           )

)





#Myclickaction = "window.open(d.hyperlink, '_blank')"

Myclickaction = "window.alert(d.hyperlink, '_blank')"
server = function(input,output) {

output$force = renderForceNetwork({
fn = forceNetwork(Links = MisLinks, Nodes = MisNodes,
                  Source = "source", Target = "target", charge = 
-150,
                  legend = TRUE, opacityNoHover = 1, Nodesize = 
"size",
                  Value = "value", NodeID = "name", height = 1000, 
fontSize = 12,linkDistance = 50,
                  Group = "group", linkWidth = 2, clickAction = 
Myclickaction,
                  opacity = 0.9, colourScale =  
JS("d3.scaleOrdinal(d3.schemeCategory20);"),
                  zoom=T)
fn$x$nodes$hyperlink <- hyperlink
fn

  })
}
shinyApp(ui = ui, server = server)

库（闪亮）
图书馆（网络3）
震源=c（0,0,1,1,1，
1,1,2,1,9,
9,9,8,8,1,
15,15,2,2,8)
目标=c（1,2,3,4,5，
6,7,8,9,10,
11,12,13,14,15,
16,17,18,19,20)
值=c（500500,10，
10,10,10,10,10,
10,10,10,10,10,
10,10,10,10,10)
错误链接=数据帧（源、目标、值）
名称=c（“拼写”、“产品”、“市场”、“流量”、“进度”，
“行会”、“领导者”、“核心技工”、“观众”、“现场直播”
问题“，
“ux”、“gd”、“艺术”、“人物角色”、“TAM”，
“冠军”、“艺术”、“gd”、“视频”、“交流”，
“观众手册”）
组=c（1,2,2,3,3，
3,3,3,3,3,
4,4,4,4,4,
3,4,4,4,4,
4)
尺寸=c（300100100,5,5，
5,5,5,3,3,
3,3,3,5,3,
3,3,3,3,3,
3)
超级链接=c（“https://confluence.hq.nordeus.com/x/SqwRAw", 
"http://yahoo.com", "http://google.com", "http://yahoo.com", 
"http://google.com）无法在预览中添加更多链接
MisNodes=data.frame（名称、组、大小、超链接）
ui=fluidPage（theme=“bootstrap.css”，
头盘(
“游戏感知：知识库”），
选项卡面板(
选项卡面板（“洞察宇宙”，
标签$head（标签$style（“#力{高度：100vh
！重要；}”），
forceNetworkOutput（“force”），
选项卡面板（“帮助”，
h1（“用户范围”，align=“中心”），
br（），
br（），
br（），
h4（“这是我们的
关于拼写灵魂的知识“，align=“center”），
h4（“阅读我们每一次收到的更多反馈
游戏的特定功能，“，align=“center”），
h4（“只需点击网络中的任何节点”，
align=“居中”）
)
)
)
#Myclickaction=“窗口.打开（d.hyperlink，”“U blank”）”
Myclickaction=“window.alert（d.hyperlink，”\u blank'）”
服务器=功能（输入、输出）{
输出$force=renderForceNetwork({
fn=强制网络（链路=错误链路，节点=错误节点，
Source=“Source”，Target=“Target”，费用=
-150,
legend=TRUE，opacityNoHover=1，Nodesize=
“大小”，
Value=“Value”，NodeID=“name”，高度=1000，
fontSize=12，linkDistance=50，
Group=“Group”，linkWidth=2，clickAction=
我的点击动作，
不透明度=0.9，色标=
JS（“d3.scaleOrdinal（d3.schemeCategory20）；”，
缩放=T）
fn$x$nodes$hyperlink使用类似于
clickAction=“shinny.onInputChange（'id'，d.description）；“
的方法将单击节点的值发送回shinny变量，该变量随后可用于UI的反应性元素，例如

library(shiny)
library(networkD3)

links <- data.frame(source = c(0,0,1,1,1,1,1,2,1,9,9,9,8,8,1,15,15,2,2,8),
                       target = c(1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20),
                       value = c(500,500,500,500,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10))
nodes <- data.frame(name = c("spellsouls", "product","market", "flow", "progression",
                             "guilds", "leaderbords","core mechanic", "audience", 
                             "live issues","ux", "gd", "art", "personas", "TAM",
                             "champions", "art","gd","videos","communication",
                             "audience book"),
                    group = c(1,2,2,3,3,3,3,3,3,3,4,4,4,4,4,3,4,4,4,4,4),
                    size = c(300,100,100,5,5,5,5,5,3,3,3,3,3,5,3,3,3,3,3,3,3))
nodes$description <- paste("This is a description of", nodes$name)


ui = fluidPage(theme = "bootstrap.css",
               headerPanel("Game perception: Knowledge base"),
               tabsetPanel(
                 tabPanel("insights universe",
                          fluidRow(
                            column(10, forceNetworkOutput("force")),
                            column(1, textOutput("text"))
                          )
                        ),
                 tabPanel("help", 
                          h1("User universe", align = "center"),
                          br(),br(),br(),
                          h4("This is a visual representation of our 
                             knowledge about Spellsouls", align = "center"),
                          h4("To read into more feedback we got for every 
                             specific feature of the game,", align = "center"),
                          h4("simply click on any node in the network", 
                             align = "center")
                          )
                        )
               )

server = function(input,output) {
  output$force = renderForceNetwork({
    fn <- forceNetwork(Links = links, Nodes = nodes, Source = "source", 
                      Target = "target", charge = -150, legend = TRUE, 
                      opacityNoHover = 1, Nodesize = "size", Value = "value", 
                      NodeID = "name", height = 1000, fontSize = 12, 
                      linkDistance = 50, Group = "group", linkWidth = 2, 
                      clickAction = "Shiny.onInputChange('id', d.description);",
                      opacity = 0.9, zoom = T)
    fn$x$nodes$description <- nodes$description
    fn
  })

  output$text <- renderPrint({ input$id })
}
shinyApp(ui = ui, server = server)

库（闪亮）
图书馆（网络3）
链接使用类似于
clickAction=“shinny.onInputChange（'id'，d.description）；”
的方法将单击节点的值发送回shinny变量，然后可以在UI的反应元素中使用，例如

library(shiny)
library(networkD3)

links <- data.frame(source = c(0,0,1,1,1,1,1,2,1,9,9,9,8,8,1,15,15,2,2,8),
                       target = c(1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20),
                       value = c(500,500,500,500,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10))
nodes <- data.frame(name = c("spellsouls", "product","market", "flow", "progression",
                             "guilds", "leaderbords","core mechanic", "audience", 
                             "live issues","ux", "gd", "art", "personas", "TAM",
                             "champions", "art","gd","videos","communication",
                             "audience book"),
                    group = c(1,2,2,3,3,3,3,3,3,3,4,4,4,4,4,3,4,4,4,4,4),
                    size = c(300,100,100,5,5,5,5,5,3,3,3,3,3,5,3,3,3,3,3,3,3))
nodes$description <- paste("This is a description of", nodes$name)


ui = fluidPage(theme = "bootstrap.css",
               headerPanel("Game perception: Knowledge base"),
               tabsetPanel(
                 tabPanel("insights universe",
                          fluidRow(
                            column(10, forceNetworkOutput("force")),
                            column(1, textOutput("text"))
                          )
                        ),
                 tabPanel("help", 
                          h1("User universe", align = "center"),
                          br(),br(),br(),
                          h4("This is a visual representation of our 
                             knowledge about Spellsouls", align = "center"),
                          h4("To read into more feedback we got for every 
                             specific feature of the game,", align = "center"),
                          h4("simply click on any node in the network", 
                             align = "center")
                          )
                        )
               )

server = function(input,output) {
  output$force = renderForceNetwork({
    fn <- forceNetwork(Links = links, Nodes = nodes, Source = "source", 
                      Target = "target", charge = -150, legend = TRUE, 
                      opacityNoHover = 1, Nodesize = "size", Value = "value", 
                      NodeID = "name", height = 1000, fontSize = 12, 
                      linkDistance = 50, Group = "group", linkWidth = 2, 
                      clickAction = "Shiny.onInputChange('id', d.description);",
                      opacity = 0.9, zoom = T)
    fn$x$nodes$description <- nodes$description
    fn
  })

  output$text <- renderPrint({ input$id })
}
shinyApp(ui = ui, server = server)

库（闪亮）
图书馆（网络3）
链接“到UI中的新面板”是什么意思？您可以修改
clickAction
JavaScript以执行不同的操作，例如显示包含您想要的任何信息的框…这就是您的意思吗？您所说的“到UI中的新面板”是什么意思？您可以修改
clickAction
JavaScript以执行不同的操作，例如显示包含所需信息的框…这就是您的意思吗？与d3相关，但与此特定示例无关，如何命名链接？使用箭头指针增加或减少？例如，连接箭头“增加”上的a-->B（&E）。与d3相关，但与此特定示例无关，如何命名链接？使用箭头指针增加或减少？例如，连接箭头上的A-->B&为“增加”。