【问题标题】:Display Image in a Data Table from a local path in R Shiny从 R Shiny 中的本地路径显示数据表中的图像
【发布时间】:2017-02-21 14:35:15
【问题描述】:

我正在尝试从 本地路径 在数据表中显示图像。请注意,本地路径与 www 文件夹不同,在实际情况下,我无法将图像从规定路径移动到 www 文件夹。奇怪的是,它是从 www 位置工作,而不是从规定的路径。寻找解决此问题的任何提示。

代码如下:

library(shiny)
library(shinyBS)
library(DT)

flag <- data.frame(image=c('<img src="C:/Users/string/100x100/100x100_bigimg.jpg"></img>'))

ui <- shinyUI(pageWithSidebar(
headerPanel("renderImage example"),
sidebarPanel(
actionButton("go","Go")
),
mainPanel(
bsModal("modalExample", "Image", "go", size =    "large",imageOutput("myImage")),

DT::dataTableOutput("dt")

)
))

server <- shinyServer(function(input, output, session) {

output$dt <- DT::renderDataTable({
DT::datatable(flag,escape = FALSE )
})

observeEvent(input$go,{
output$myImage <- renderImage({
# Return a list containing the filename
return(list(src = "C:/Users/string/100x100/100x100_bigimg.jpg",
     contentType = 'image/png',
     width = 550,
     height = 400,
     alt = "This is alternate text"))
}, deleteFile = FALSE)

})

})

shinyApp(ui,server)

另外,从规定的路径 renderImage 部分工作正常,但在数据表部分图像没有得到显示。

【问题讨论】:

    标签: r datatables shiny dt


    【解决方案1】:

    这可以使用 addResourcePath 来实现 - 适用于 Windows 以及 Shiny web Server。它添加了静态资源的目录。 https://shiny.rstudio.com/reference/shiny/latest/addResourcePath.html

    以下是工作示例:

    ui.R

    library(shiny)
    library(shinydashboard)
    library(shinyBS)
    library(DT)
    
    dashboardPage(
    dashboardHeader(title = span(tagList(icon("image"), "Example"))),
    dashboardSidebar(),
    dashboardBody(
    
    div(style="display:inline-block",uiOutput("infoButton")),
    
    DT::dataTableOutput("table2")
    
     )
    )
    

    服务器.R

    addResourcePath("Images","D/HDImages") # Images are located outside shiny App
    
    LeafNames <- c('Leaf1.jpg','Leaf2.jpg','Leaf3.jpg','Leaf4.jpg','Leaf5.jpg','Leaf6.jpg','Leaf7.jpg','Leaf8.jpg','Leaf9.jpg','Leaf10.jpg')
    LeafTable <- data.frame(LeafNames)
    LeafTable<- within(LeafTable, thumbnail <- paste0("<img 
    src='","Images/",LeafTable$LeafNames,"' height='50'></img>"))
    
    function(input, output) { 
    
    output$table2<-DT::renderDataTable({
    
    responseDataFilter2 <- LeafTable[,c(2,1)]
    
    displayableData<-DT::datatable(data = as.data.frame(responseDataFilter2, stringAsFactors = FALSE, row.names = NULL),
    
                                   escape=FALSE,selection="single",rownames=FALSE,colnames=c(" ","Name"),
    
                                   callback = JS("table.on('dblclick.dt', 'td', function() {
                                                 var row=table.cell(this).index().row;
                                                 Shiny.onInputChange('rows_home',[row, Math.random()])});
                                                 table.on('click.dt', 'td', function() {
                                                 var k=table.cell(this).index().row;
                                                 if(table.rows('.selected').indexes().toArray()!= '' && table.rows('.selected').indexes().toArray() == k){k=-1;}
                                                 Shiny.onInputChange('rows_up_home',[k, Math.random()]);
                                                 Shiny.onInputChange('row_path', table.rows(this).data().toArray());
                                                 });"),
    
                                   options = list(
    
                                     paging=FALSE,searching = FALSE,ordering=FALSE,scrollY = 750,scrollCollapse=TRUE,server = TRUE
    
                                   ))
    
    })
    
    output$infoButton = renderUI({
    s = input$table2_rows_selected # Row number of selected row 
    if (length(s)!= 0) {
      tagList(
        actionButton("info", "",icon("info-circle"),style="color:rgb(57,156,8);border-color:rgb(255,255,255)"),
    
        # Information Dialog Box
        bsModal("ObjectInfo", LeafTable[s,c(1)], "info", size = "large", # Enables Pop up Screen
    
                img(src= paste0("Images/",LeafTable[s,c(1)]),width='800',height='600')
    
        )
      )
    
    }
    })
    
    }
    

    【讨论】:

      猜你喜欢
      • 2020-12-29
      • 2015-02-12
      • 2014-06-20
      • 1970-01-01
      • 1970-01-01
      • 2020-04-28
      • 2022-10-05
      • 2018-11-08
      • 1970-01-01
      相关资源
      最近更新 更多