代码之家  ›  专栏  ›  技术社区  ›  TarJae

chartJSRadar downloadhandler创建空png

  •  0
  • TarJae  · 技术社区  · 6 年前

    Save plots made in a shiny app ), https://groups.google.com/forum/#!msg/shiny-discuss/u7gwXc8_vyY/IZK_o7b7I8gJ
    所以我的代码是一个示例代码:

    用户界面:

    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')
      )
    ))
    

    
    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()
      })    
    })
    
    0 回复  |  直到 6 年前
        1
  •  1
  •   Stéphane Laurent    6 年前

    下面是一个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 只是。使用 韦伯肖特 导出到 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)
    
        2
  •  1
  •   Ben    6 年前

    chartJSRadar 返回一个 htmlWidget . 要保存,请尝试使用 saveWidget 然后 webshot 临时的 html 韦伯肖特

    library(webshot)
    

    试着用这个代替 downloadHandler server 功能:

    output$downloadPlot <- downloadHandler(
      filename = "Shinyplot.png",
      content = function(file) {
        saveWidget(plot2(), "temp.html", selfcontained = TRUE)
        webshot("temp.html", file = file)
      }
    ) 
    
    推荐文章