Unable to show image store in www folder in leaflet within Rshiny App

Question

I have been using R-shiny for while, and I wanted to add an image to my leaflet pop-up content. I get a broken image. Although I saved it in a local folder (www) and I called it from there, but its still broken as if it doesn't recognize its an image.

Here is a minimum reproducible example :

library(shiny)
library(leaflet)


city <- paste(sep = "<br/>",
             paste0("<img src='www/image.jpg',width = 50,
       height = 100, ' />")



ui <- fluidPage(
  leafletOutput("map", height = '1000px'))

server <- function(input, output, session) {
  
  output$map <- renderLeaflet({
    leaflet()%>%addTiles() %>%
      #leaflet::addPopups(-122.327298, 47.597131)%>%
      addMarkers(-122.327298, 47.597131, popup  = "city")%>%
    addMarkers(
      lng = -118.456554, lat = 34.105,
      label = "Default Label",
      popup =city,
      labelOptions = labelOptions(noHide = T))

  })
}

shinyApp(ui, server)

Answer 1

As mentioned in the comments, images placed under www should be referenced without the www folder name.

Thus, this does the trick for me (N.B. I replaced your paste'd HTML string by using tags from htmltools but this more syntactic sugar):

Code

library(shiny)
library(leaflet)

city <- tags$img(src = "image.jpg", width = 50, height = 100) %>% 
   tagList(tags$br()) %>% 
   as.character() 

ui <- fluidPage(
   leafletOutput("map", height = "1000px")
)

server <- function(input, output, session) {
   
   output$map <- renderLeaflet({
      leaflet() %>% 
         addTiles() %>%
         addMarkers(
            lng = -118.456554, lat = 34.105,
            label = "Default Label",
            popup = city)
      
   })
}

shinyApp(ui, server)

File Structure

Root Folder

www Folder

Result

Final Remark

I observed that in my first try, the marker icon was not properly displayed and was indeed a broken image. This was resolved by updating the leaflet library.