我想做什么
我正在尝试构建一个闪亮的应用程序，它使用选项卡集面板显示不同的交互式HTML绘图。它们都应该出现在renderUI的同一个调用中。如下例所示，我的绘图基于d3框架(如包networkD3和processanimateR(。
问题
不幸的是，renderUI只显示了生成的第一个图。更改选项卡后，第二个绘图将不会显示。processanimateR给了我错误Failed to render the graph. It is probably too large. Original error: TypeError: d3.create is not a function at PATokens.insertTokens (<anonymous>:185:25) at <anonymous>:52:33 at <anonymous>:105:9。当然，绘图不会太大而无法显示(数据方面(，因为更改选项卡序列可以完美地生成它。这种行为与最先显示的情节无关。在下面的示例中，我标记了可以用来交换tab01和tab02的行，以查看会发生什么。
我尝试了什么
通过提出我能想到的最小的例子，我可能排除了许多错误来源。此外，我尝试过使用多个uiOutput(每个选项卡一个(，但没有成功。问题仍然存在。正如这个最小的例子所表明的那样，d3在后台运行可能会出现问题。也许有一些图形引擎无法关闭选项卡更改或其他与js相关的内容。
我的问题
有没有办法在一个闪亮的应用程序中显示多个d3图，使它们都按预期显示？
提前谢谢！
我的例子
#XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
#XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
# Settings
#XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
#XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
# Packages
sapply(c("shiny","processanimateR","bupaR","networkD3"),require,character.only=T)
# data
x <- structure(list(
activity = c(
"action 1", "action 2", "action 3",
"action 5", "action 2", "action 3", "action 25", "action 26",
"action 2", "action 3", "action 1", "action 2", "action 3", "action 1",
"action 2", "action 3", "action 1", "action 2", "action 3", "action 5",
"action 2", "action 3", "action 25", "action 26", "action 2",
"action 3", "action 1", "action 2", "action 3", "action 1", "action 2",
"action 3"),
id = c(494.18, 494.18, 494.18, 485.56, 485.56, 485.56,
413.99, 413.99, 413.99, 413.99, 439.49, 439.49, 439.49, 466.38,
466.38, 466.38, 494.18, 494.18, 494.18, 485.56, 485.56, 485.56,
413.99, 413.99, 413.99, 413.99, 439.49, 439.49, 439.49, 466.38,
466.38, 466.38), .order = 1:32,
activity_instance_id_by_bupar = c(1L,
2L, 3L, 16L, 17L, 18L, 50L, 51L, 52L, 53L, 60L, 61L, 62L, 71L,
72L, 73L, 1L, 2L, 3L, 16L, 17L, 18L, 50L, 51L, 52L, 53L, 60L,
61L, 62L, 71L, 72L, 73L),
lifecycle_id = c("start", "start",
"start", "start", "start", "start", "start", "start", "start",
"start", "start", "start", "start", "start", "start", "start",
"complete", "complete", "complete", "complete", "complete", "complete",
"complete", "complete", "complete", "complete", "complete", "complete",
"complete", "complete", "complete", "complete"),
timestamp = structure(c(1424304001,
1377475201, 1516579201, 1384128001, 1375401601, 1397952001, 1328486401,
1364688001, 1318032001, 1384905601, 1348099201, 1342483201, 1366416001,
1361404801, 1358726401, 1384905601, 1425168001, 1378339201, 1517443201,
1384992001, 1376265601, 1398816001, 1329350401, 1365552001, 1318896001,
1385769601, 1348963201, 1343347201, 1367280001, 1362268801, 1359590401,
1385769601),
tzone = "UTC", class = c("POSIXct", "POSIXt")),
trace = c("action 2,action 1,action 3", "action 2,action 1,action 3",
"action 2,action 1,action 3", "action 2,action 5,action 3",
"action 2,action 5,action 3", "action 2,action 5,action 3",
"action 2,action 25,action 26,action 3", "action 2,action 25,action 26,action 3",
"action 2,action 25,action 26,action 3", "action 2,action 25,action 26,action 3",
"action 2,action 1,action 3", "action 2,action 1,action 3",
"action 2,action 1,action 3", "action 2,action 1,action 3",
"action 2,action 1,action 3", "action 2,action 1,action 3",
"action 2,action 1,action 3", "action 2,action 1,action 3",
"action 2,action 1,action 3", "action 2,action 5,action 3",
"action 2,action 5,action 3", "action 2,action 5,action 3",
"action 2,action 25,action 26,action 3", "action 2,action 25,action 26,action 3",
"action 2,action 25,action 26,action 3", "action 2,action 25,action 26,action 3",
"action 2,action 1,action 3", "action 2,action 1,action 3",
"action 2,action 1,action 3", "action 2,action 1,action 3",
"action 2,action 1,action 3", "action 2,action 1,action 3"
),
n = c(3, 3, 3, 3, 3, 3, 4, 4, 4, 4, 3, 3, 3, 3, 3,
3, 3, 3, 3, 3, 3, 3, 4, 4, 4, 4, 3, 3, 3, 3, 3, 3),
absolute_frequency = c(3L,
3L, 3L, 1L, 1L, 1L, 1L, 1L, 1L, 1L, 3L, 3L, 3L, 3L, 3L, 3L,
3L, 3L, 3L, 1L, 1L, 1L, 1L, 1L, 1L, 1L, 3L, 3L, 3L, 3L, 3L,
3L),
relative_frequency = c(0.272727272727273, 0.272727272727273,
0.272727272727273, 0.0909090909090909, 0.0909090909090909,
0.0909090909090909, 0.0909090909090909, 0.0909090909090909,
0.0909090909090909, 0.0909090909090909, 0.272727272727273,
0.272727272727273, 0.272727272727273, 0.272727272727273,
0.272727272727273, 0.272727272727273, 0.272727272727273,
0.272727272727273, 0.272727272727273, 0.0909090909090909,
0.0909090909090909, 0.0909090909090909, 0.0909090909090909,
0.0909090909090909, 0.0909090909090909, 0.0909090909090909,
0.272727272727273, 0.272727272727273, 0.272727272727273,
0.272727272727273, 0.272727272727273, 0.272727272727273)),
row.names = c(NA,
-32L),
class = c("eventlog", "log", "tbl_df", "tbl", "data.frame"
),
case_id = "id", activity_id = "activity", activity_instance_id = "activity_instance_id_by_bupar",
lifecycle_id = "lifecycle_id",
resource_id = "id",
timestamp = "timestamp")
y <- jsonlite::fromJSON(paste0('https://cdn.rawgit.com/christophergandrud/networkD3/','master/JSONdata/energy.json'))
#XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
#XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
# Shiny-App UI ----
#XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
#XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
ui <- shinyUI(fluidPage(
title="shiny example",
sidebarLayout(
position="left",
sidebarPanel(),
mainPanel(
tags$div(
do.call(
tabsetPanel,
c(id='tabs',
lapply(1:2,function(y){
tabPanel(id=paste0("tab0",y),value=paste0("tab0",y),title=strong(paste0("This is tab0",y),align="left",style="black"),selected=1)
})
)
),
uiOutput("out_ui")
)
)
),
style=paste0("font-family: Arial;")
))
#XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
#XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
# Shiny-App Server ----
#XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
#XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
server <- function(input,output,session){
output$out_ui <- renderUI({
# X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X
# >>>> Problem Segment <<<< ----
# X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X
# Try: Chance this to "tab01"
if(input$tabs=="tab02"){
# Process
animate_process(
x,
processmap=process_map(
x,
type=frequency("absolute",color_scale="Paired",color_edges="Greys"),
rankdir="TB",render=F,fixed_edge_with=T,
layout=layout_pm(
edge_weight=F,
edge_cutoff=0)),
mapping=token_aes(
size=token_scale(8),
color=token_scale(
range="black",
scale="ordinal"
),
opacity=token_scale(100)
),
duration=60,mode="absolute",timeline=T,jitter=10,initial_time=0,
repeat_count=10,repeat_delay=2,width=1200,height=900,
sizingPolicy=htmlwidgets::sizingPolicy(
browser.fill=T,viewer.fill=F,
knitr.figure=F,knitr.defaultWidth="100%",knitr.defaultHeight="1000")
)
# X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X
# >>>> Problem Segment <<<< ----
# X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X X
# Try: Chance this to "tab02"
}else if(input$tabs=="tab01"){
# Sankey
sankeyNetwork(
Links=y$links,Nodes=y$nodes,Source='source',
Target='target',Value='value',NodeID='name',
units='TWh',fontSize=12,nodeWidth=30
)
}
})
}
shinyApp(ui=ui,server=server)
#XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
#XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
我可以告诉你为什么它不起作用。processAninmateR使用D3 5.7。CCD_ 15使用D3 4.5。我检查了一下，以确保我的包裹是最新的；没有这样的运气。这些软件包似乎也没有匹配的版本。
这里有一个变通方法。这样可以保存Sankey，但也可以保存过程动画(使用saveWidget(。当你保存这个文件时，它需要在你的闪亮的目录中。R文件或该文件的子目录。如果您使用此处显示的代码，它将自动将其保存在正确的位置。
在您的代码中发生了一些奇怪的事情，但我要大胆猜测一下，这是因为您可能已经尝试了无数种方法来实现这一点。
您可以将else if呼叫的信息替换为以下信息：
# save to an object
sn <- sankeyNetwork(Links = y$links, Nodes = y$nodes, Source = 'source',
Target = 'target', Value = 'value', NodeID = 'name',
units = 'TWh', fontSize = 12, nodeWidth = 30)
saveNetwork(sn, "sankey.html") # save in local folder
addResourcePath("tmp", getwd()) # connect with file
tags$iframe(src = "tmp/sankey.html", width = "100%", # show plot in page
frameBorder = "0", height = "500px")