[英]chartJSRadar downloadhandler creating empty png
我想在我的 shiny 應用程序中創建一個下載按鈕,以下載使用 chartJSRadar 創建的反應式 plot。 我無法解決這個問題,因為我已經通過互聯網上記錄的問題,我無法解決它。 一直收到一個空的png。 按照建議( 保存在 shiny 應用程序中制作的圖), https://groups.google.com/forum/#!msg/shiny-discuss/u7gwXc8_vyY/IZK_o7b7I8gJ
我建立了一個 function... 所以我的代碼是一個示例代碼:
ui.R:
library(radarchart)
shinyUI(pageWithSidebar(
headerPanel('Radarchart Shiny Example'),
sidebarPanel(
checkboxGroupInput('selectedPeople', 'Who to include',
names(radarchart::skills)[-1], selected="Rich")
),
mainPanel(
chartJSRadarOutput("plot1", width = "450", height = "300"), width = 7,
radioButtons(inputId = "var3", label = "Select the file type", choices = list("png", "pdf")),
downloadButton('downloadPlot', 'Download Plot')
)
))
server.R
library(radarchart)
shinyServer(function(input, output) {
output$plot1 <- renderChartJSRadar({
chartJSRadar(skills[, c("Label", input$selectedPeople)],
maxScale = 10, showToolTipLabel=TRUE)
})
plot2 <- function(){
chartJSRadar(skills[, c("Label", input$selectedPeople)],
maxScale = 10, showToolTipLabel=TRUE)
}
output$downloadPlot <- downloadHandler(
filename = "Shinyplot.png",
content = function(file) {
png(file)
plot2()
print(plot2())
dev.off()
})
})
chartJSRadar
返回一個htmlWidget
。 要保存,請嘗試使用saveWidget
,然后使用臨時webshot
文件的html
。 添加webshot
庫:
library(webshot)
並嘗試在您的server
function 中將其替換為downloadHandler
:
output$downloadPlot <- downloadHandler(
filename = "Shinyplot.png",
content = function(file) {
saveWidget(plot2(), "temp.html", selfcontained = TRUE)
webshot("temp.html", file = file)
}
)
這是一種 JavaScript 方式,我認為它應該比webshot
更快。
library(shiny)
library(radarchart)
library(htmlwidgets) # to use the 'onRender' function
js <- c(
"function(el, x){",
" $('#downloadPlot').on('click', function(){",
" // Clone the chart to add a background color.",
" var cloneCanvas = document.createElement('canvas');",
" cloneCanvas.width = el.width;",
" cloneCanvas.height = el.height;",
" var ctx = cloneCanvas.getContext('2d');",
" ctx.fillStyle = '#FFFFFF';",
" ctx.fillRect(0, 0, el.width, el.height);",
" ctx.drawImage(el, 0, 0);",
" // Download.",
" const a = document.createElement('a');",
" document.body.append(a);",
" a.download = 'radarchart.png';",
" a.href = cloneCanvas.toDataURL('image/png');",
" a.click();",
" a.remove();",
" });",
"}"
)
ui <- pageWithSidebar(
headerPanel('Radarchart Shiny Example'),
sidebarPanel(
checkboxGroupInput('selectedPeople', 'Who to include',
names(radarchart::skills)[-1], selected="Rich"),
actionButton('downloadPlot', 'Download Plot')
),
mainPanel(
chartJSRadarOutput("plot1", width = "450", height = "300"), width = 7
)
)
server <- function(input, output) {
output$plot1 <- renderChartJSRadar({
chartJSRadar(skills[, c("Label", input$selectedPeople)],
maxScale = 10, showToolTipLabel=TRUE) %>%
onRender(js)
})
}
shinyApp(ui, server)
這僅導出為png
。 使用webshot
導出到pdf
。
library(shiny)
library(radarchart)
js <- paste0(c(
"$(document).ready(function(){",
" $('#downloadPlot').on('click', function(){",
" var el = document.getElementById('plot1');",
" // Clone the chart to add a background color.",
" var cloneCanvas = document.createElement('canvas');",
" cloneCanvas.width = el.width;",
" cloneCanvas.height = el.height;",
" var ctx = cloneCanvas.getContext('2d');",
" ctx.fillStyle = '#FFFFFF';",
" ctx.fillRect(0, 0, el.width, el.height);",
" ctx.drawImage(el, 0, 0);",
" // Download.",
" const a = document.createElement('a');",
" document.body.append(a);",
" a.download = 'radarchart.png';",
" a.href = cloneCanvas.toDataURL('image/png');",
" a.click();",
" a.remove();",
" cloneCanvas.remove();",
" });",
"});"
), collapse = "\n")
ui <- pageWithSidebar(
headerPanel('Radarchart Shiny Example'),
sidebarPanel(
checkboxGroupInput('selectedPeople', 'Who to include',
names(radarchart::skills)[-1], selected="Rich"),
actionButton('downloadPlot', 'Download Plot')
),
mainPanel(
tags$head(tags$script(HTML(js))),
chartJSRadarOutput("plot1", width = "450", height = "300"), width = 7
)
)
server <- function(input, output) {
output$plot1 <- renderChartJSRadar({
chartJSRadar(skills[, c("Label", input$selectedPeople)],
maxScale = 10, showToolTipLabel=TRUE)
})
}
shinyApp(ui, server)
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.