Shiny App with Embedded Photo not Working

Question

I am trying to work through the R Studio Shiny tutorials. The second tutorial includes embedding an image into an app. It seems straight-forward and a similar question-and-answer here seems to use the same approach:

Embedding Image in Shiny App

However, I cannot get this approach to work. Here is a stripped-down version of R Studio's second tutorial code and a screenshot of the result I get. I have the png file in my working directory. Must the photo be placed somewhere else?

setwd('C:/Users/mark_/Documents/RShiny/')

library(shiny)

ui <- fluidPage(
  titlePanel('Shiny App with Photo'),
  sidebarLayout(
    sidebarPanel(
      h2("Installation"),
      p("Shiny is on CRAN"),
      br(),
      img(src = "myScreenshot.png", height = 70, width = 200),
      br()
    ),
    mainPanel(
      h1("Shiny"),
      p("Shiny is a package from RStudio"), 
      br()
    )
  )
)

server <- function(input, output) {

}

shinyApp(ui = ui, server = server)

EDIT to Add Additional Steps Taken

When I originally posted my issue with R Shiny I was using the default R GUI. I have since switched to R Studio in case R Shiny works best that way. But this has not helped.

I have installed Rtools and added the following code to the very top of the above app.R file:

install.packages('zip')
install.packages('shinyjs')
install.packages('shinydashboard')
install.packages('shinyBS')
install.packages('shinyWidgets')

library(zip)
library(shinyjs)
library(shinydashboard)
library(shinyBS)
library(shinyWidgets)

install.packages('backports')
library(backports)
install.packages('devtools')
library(devtools)

rm(list=ls())
getwd()
setwd('C:/Users/mark_/Documents/RShiny/')
getwd()
library(shiny)

But this has not helped either.

As suggested by @MattB below I have created a subfolder named www inside the folder C:/Users/mark_/Documents/RShiny and place the file myScreenshot.png inside that www subfolder. However, this has not solved the problem. The image still does not appear.

I also tried placing the file myScreenshot.png inside that www subfolder of the RStudio folder under Program Files (C:\Program Files\RStudio\www) but this has not helped.

The image does not appear under the Open in Browser tab or under the http:// tab.

There are two options I have not yet tried. Perhaps I must change the name of the folder containing the app.R file (C:/Users/mark_/Documents/RShiny) to something other than RShiny. Perhaps that is confusing R Studio.

There is another issue that perhaps is preventing R Studio from locating the image file. When I install an R package I get the following message:

> install.packages('reshape2')
Installing package into ‘C:/Users/mark_/Documents/R/win-library/4.0’
(as ‘lib’ is unspecified)
also installing the dependency ‘plyr’

I end up with both:

C:\Program Files\R\R-4.0.0
C:\Users\mark_\Documents\R\win-library\4.0

I wonder whether that has anything to do with R Studio not being able to locate the image file.

Answer 1

For any files to be available to the app user, they need to be placed in the /www directory within your app folder. You don't need to change your code otherwise, as the user's browser will see this folder automatically.

Answer 2

I was able to get the R script to run in R Studio and display an image file by following suggestions by Dean Attali @DeanAttali at this website.

https://deanattali.com/blog/building-shiny-apps-tutorial/

I renamed the folder to Shineexample2 and placed that folder directly in the Documents folder. (C:\Users\mark_\Documents\Shineexample2) This was not one of Dean Attali's suggestions but the rest of the following was or was at least how I interpreted his suggestions.

This new folder Shineexample2 only contained the file app.R and the www subfolder containing the image file.

I opened the app.R file in R Studio, not the default R GUI, using File then Open File....

Then I clicked on Run App in the upper middle area of the R Studio GUI.

The file ran as expected.

The above process differed from my earlier attempts in several ways. Previously the app.R file was in a folder with a different name and containing many other files and subfolders. Usually I opened the file app.R in Notepad and copied and pasted its contents into R Studio. Then I selected all of the code and ran it using Code then Run Selected Line(s). I never noticed the Run App term at the top of the R Studio Gui before visiting Dean's website.

If I determine exactly which of these changes was most critical to successful execution of my code I may edit this answer in the future to provide that information.

Here are the complete contents of the app.R file that ran successfully.

#
# Stack_Overflow_Shiny_question_about_embedding_images_May22_2020.R
#
# install.packages('shiny')
# install.packages('zip')
# install.packages('shinyjs')
# install.packages('shinydashboard')
# install.packages('shinyBS')
# install.packages('shinyWidgets')
# install.packages('devtools')
# 

library(shiny)
library(zip)
library(shinyjs)
library(shinydashboard)
library(shinyBS)
library(shinyWidgets)

install.packages('backports')
library(backports)

library(devtools)


rm(list=ls())
getwd()
setwd('C:/Users/mark_/Documents/Shineexample2/')
getwd()
library(shiny)


ui <- fluidPage(
  titlePanel('Shiny App with Photo'),
  sidebarLayout(
    sidebarPanel(
      h2("Installation"),
      p("Shiny is on CRAN"),
      br(),
      img(src = "RStudio.png", height = 70, width = 200),
      br()
    ),
    mainPanel(
      h1("Shiny"),
      p("Shiny is a package from RStudio"), 
      br()
    )
  )
)

server <- function(input, output) {

}

shinyApp(ui = ui, server = server)