本文介绍了为networkD3应用程序实施工具提示的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我想在Shiny托管的networkD3图中实现类似于ggvis函数的工具提示,例如:
I want to implement a tooltip in Shiny-hosted networkD3 plot similar to the ggvis function, e.g:
require(ggvis); require(shiny)
all_values = function(x){ "<a href='#'>Option 1</a><br/><a href='#'>Option 2</a>"}
server = function(input, output, session) {
observe({
ggvis(mtcars, ~disp, ~mpg) %>% layer_points() %>%
add_tooltip(all_values, 'click') %>%
bind_shiny('ggvis_plot', 'ggvis_ui')
})
}
ui = fluidPage( uiOutput("ggvis_ui"), ggvisOutput("ggvis_plot"))
shinyApp(ui, server)
是否有一种优雅的Shiny或D3/javascript方法来实现简单的networkD3图-例如下面的内容?
Is there an elegant Shiny or D3/javascript way to achieve this for a simple networkD3 plot - such as below?
library(shiny); library(networkD3)
server <- function(input, output) {
output$simple <- renderSimpleNetwork({
src <- c("A", "A", "A", "A", "B", "B", "C", "C", "D")
target <- c("B", "C", "D", "J", "E", "F", "G", "H", "I")
networkData <- data.frame(src, target)
simpleNetwork(networkData)
})
}
ui <- shinyUI(fluidPage(simpleNetworkOutput("simple")))
shinyApp(ui = ui, server = server)
推荐答案
这也可以通过networkD3::simpleNetwork
使用htmlwidgets::onRender
library(shiny)
library(networkD3)
library(htmlwidgets)
clickJS <- "
function(el) {
d3.select(el)
.append('div')
.attr('class', 'xtooltip')
.style('position', 'absolute')
.style('border', '1px solid #999')
.style('border-radius', '3px')
.style('padding', '5px')
.style('opacity', '0.85')
.style('background-color', '#fff')
.style('box-shadow', '2px 2px 6px #888888')
;
d3.select(el)
.selectAll('.node')
.on('click', function(d) {
d3.select(el)
.select('.xtooltip')
.html('name: ' + d.name + '<br>' + 'group: ' + d.group)
.style('left', (d3.event.pageX) + 'px')
.style('top', (d3.event.pageY - 28) + 'px')
;
})
}
"
server <- function(input, output) {
output$simple <- renderSimpleNetwork({
src <- c("A", "A", "A", "A", "B", "B", "C", "C", "D")
target <- c("B", "C", "D", "J", "E", "F", "G", "H", "I")
networkData <- data.frame(src, target)
sn <- simpleNetwork(networkData)
onRender(sn, clickJS)
})
}
ui <- shinyUI(fluidPage(simpleNetworkOutput("simple")))
shinyApp(ui = ui, server = server)
这篇关于为networkD3应用程序实施工具提示的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!