Image output in shiny app

Question

I am trying to include an image in a shiny app. I want: "if it is type 1 plot "this image", if it is type 0 plot "this other image". I know that I have to put the jpg files into the folder where the app.R is and then call it but I do not know how.

This is the code I have used until now (it works), I just have to include the images in the render.

library(shiny)

# Define UI for application that draws a histogram
ui <- fluidPage(

  # Application title
  titlePanel("Myapp"),

  #Inputs
  dateInput(inputId = "dob", label="Birth"),
  dateInput(inputId = "ad", label="Date"),
  actionButton("Submit", icon("fas fa-magic"), label="Submit"),


  #Outputs
  textOutput(outputId = "textR"),
  imageOutput(outputId = "imageR1"),
  imageOutput(outputId="imageR2")
)



# Define server logic required to draw a histogram
server <- function(input, output) {
  #my output should be named textR and imageR1, imageR2

  observeEvent(input$Submit, 
           output$textR<-renderText({
             v1<-as.numeric(as.Date(input$ad,format="%Y/%m/%d") - as.Date(input$dob, format="%Y/%m/%d"))/30.5
             value_v1<-ifelse(v1>48, "type1", "type2")
             print(value_v1)
           }))

}

# Run the application 
shinyApp(ui = ui, server = server)

Answer 1

It is bad practice to define an output object inside an observeEvent. In this case, independent on the choice of how to switch the images, I would advice to use an eventReactive - let's call that myval. That creates a reactive which only changes when a certain event happens, in this case a click on the submit button. We can then refer to this in the body of the renderText statement, so that can simply become:

  output$textR<-renderText({
    print(myval())
  })

Secondly, for the outputting of images, you should place those in the www directory, see here. We can then create an ui element with renderUI and UIOutput, in which we use the value of our eventReactive myval() to select the image to display.

A working example is given below. Note that I saved it as app.R, and used the folder structure of the referred link, so:

| shinyApp/
    | app.R
    | www/
       | zorro.jpg
       | notzorro.jpg

Hope this helps!

---

library(shiny)

# Define UI for application that draws a histogram
ui <- fluidPage(

  # Application title
  titlePanel("Myapp"),

  #Inputs
  dateInput(inputId = "dob", label="Birth"),
  dateInput(inputId = "ad", label="Date"),
  actionButton("Submit", icon("fas fa-magic"), label="Submit"),

  #Outputs
  textOutput(outputId = "textR"),
  uiOutput(outputId = "my_ui")
)



# Define server logic required to draw a histogram
server <- function(input, output) {

    myval <- eventReactive(input$Submit,
                         {
                           v1<-as.numeric(as.Date(input$ad,format="%Y/%m/%d") - as.Date(input$dob, format="%Y/%m/%d"))/30.5
                           return(ifelse(v1>48, "type1", "type2"))
                         })

  output$textR<-renderText({
    print(myval())
  })

  output$my_ui<-renderUI({
    if(myval()=='type1')
      img(src='zorro.jpg', height = '300px')
    else
      img(src='notzorro.jpg', height = '300px')
  })

}

# Run the application 
shinyApp(ui = ui, server = server)