R Shiny Reactively Display an Image from a list

Question

I am trying to reactively display an image from a list in an R shiny application.

I have many .tiff images stored in the "www" directory of my app. They follow the naming convention OHC_130.tiff, OHC_131.tiff, OHC_132.tiff, IHC_133.tiff, Deiter_134.tiff, OHC_135.tiff etc...

I also have a vector containing all of these names

ImgID_Vector <- as.vector(c("OHC_130", "OHC_131", "OHC_132", "IHC_133", "Deiter_134", "OHC_135")

I would like to make a selectable input dropdown list like this where a user can select an image and then click the submit button to make the image appear below. I have set this up for the ui.r but i am not sure how to make it work on the server side.

#ui.r
library(shiny)
library(shinydashboard)

dashboardBody(
  tabItems(
    tabItem(tabName = "dt",
          h2("Select an image"),
          fluidRow(
            box(title="This is a searchable database of images", solidHeader = TRUE,status = "primary"),
            selectInput("input$ImageIDVariable1", label = h4("Enter your image of interest"), choices = (ImgID_Vector), multiple = TRUE),
            submitButton("Submit"),
            imageOutput("ImageID_Image")
          )
)
)

Conceptually I know that on the server side I need to connect the user input from the UI side to the actual image in the "www" folder. I should be able to do this using reactive inputs and renderImage I think. But I am not sure how to write the render image command to achieve the desired result.

#server.r

#This is the data that contains the choices for the dropdown menu
ImgID_Vector <- readRDS("ImgID_Vector.RDS")

shinyServer(function(input, output) {
# This is where I am struggling, with the render image command
output$ImageID_Image <- renderImage({
    filename <- normalizePath(file.path('./www',
                          paste(input$ImageIDVariable1, '.tiff', sep='')))
    list(src = filename)
  }, deleteFile = FALSE)
}

#This is where I have the reactive input variable
ImageIDVariable1 <- reactive({input$ImageIDVariable1})

})

Thanks for your help!

Answer 1

Hi argument inputId from your selectInput is wrong, it should be "ImageIDVariable1" , not input$ImageIDVariable1 .

In ui.R :

selectInput(inputId = "ImageIDVariable1", label = h4("Enter your image of interest")

In server.R

input$ImageIDVariable1

Moreover :

You should use this in a script called global.R or at least in ui.R :

ImgID_Vector <- readRDS("ImgID_Vector.RDS")

And you should not use multiple = TRUE because renderImage can only render one image at a time.

And you should put a selected choice by default, if not renderImage will search an image which doesn't exist.