使用Shiny

Question

目标：将可用的tabPanel分成相等的单元格，并用Shiny在单元格中显示图像，水平空间（列）中的单元格数量可以由selectInput输入和更改。随着列数的变化，网格和图像的大小也会变化。

问题：如何更改单元格之间的（水平和垂直）间距？如何调整图像大小以适合单元格？如何使用Shiny更有效地加载和显示数百张图像？预先谢谢你！

下面是从this和this改编而成的代码，它们可以显示图像，但是前面提到了一些问题。

rm(list = ls())
library(shiny)

img_dirs <- list.files("www/image", full.names = TRUE)
# img_dirs <- img_dirs[1:10]
img_num <- length(img_dirs)


render_image <- function(img_num, input, output) {

  for (i in seq.int(img_num)) {

    local({
      ii <- i  
      output[[paste0("img_", ii)]] <- renderImage({

        list(src = img_dirs[ii],
             contentType = 'image/jpg',
             width = '50%',
             height = 'auto',
             alt = "Image failed to render")
      }, deleteFile = FALSE)
    })
  }
}


ui <- shinyUI(

  navbarPage(
    theme = shinythemes::shinytheme("cerulean"),
    title = "UU",


    tabPanel('images', 
             sidebarPanel(
               selectInput('col_num', 'Columns', c(1, 2, 3, 4, 6, 12), selected = 4)),

             mainPanel(
               uiOutput('myplots'))
    )
  )
)



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

  output$myplots <- renderUI({


    ## Construct imageOutputs
    img_out_lst <- lapply(seq.int(img_num), function(i)
      imageOutput(paste0('img_', i)))

    fluidRow(
      lapply(
        split(img_out_lst, f = rep(c(1 : as.numeric(input$col_num)), length.out = length(img_out_lst))), 
        function(x) column(width = 12 / as.numeric(input$col_num), x, offset = 0, align="center",
                           style = "padding: 0px 0px; margin-top:-2em")) # fail to decrease spacing
    )

  })
  observeEvent(img_num, render_image(img_num, input, output))
})

shinyApp(ui, server)