How to insert image in interactive map?

[meitei]

How can I add a logo for auburn and Alabama in the code below?

Thanks

library(tidyverse)
library(plotly)
library(leaflet)

df=data.frame(
  win=c("Ironbowl-37","Ironbowl-47"),
  uni = c("Auburn University, USA", "University of Alabama, USA"),
  lat=c(32.5934,33.2140),
  lon=c(-85.4952,-87.5391)
  )
custom.labels <-paste("<b>",df$win,"</b>","<br>",df$uni)

#plotting of map
leaflet(df) %>% 
  addTiles() %>% 
  addCircleMarkers(lng = ~lon,lat = ~lat,radius = df$uni) %>% 
  addPopups(lng = ~lon,lat = ~lat, 
            popup = lapply( custom.labels, htmltools::HTML ),            
            options = popupOptions(closeButton = FALSE,autoPan  =TRUE)) 

[jlacko]

This is an interesting problem, as there are multiple ways to approach it.

The first is to work with the way your markers are displayed - circles, icons, or something in between. A while back I wrote a blog post describing alternative approaches to the problem, you can find it here Leaflet Map Markers in R · Jindra Lacko

The second is to incorporate generic HTML - which of course can handle images - in your popups. This would look like the code below; note how the code to construct the popup uses single quotes to deliminate the string, so that double quotes can be used inside as part of the HTML syntax.

library(dplyr)
library(leaflet)

df=data.frame(
  win=c("Ironbowl-37","Ironbowl-47"),
  uni = c("Auburn University, USA", "University of Alabama, USA"),
  image = c("https://upload.wikimedia.org/wikipedia/commons/thumb/1/15/Auburn_Tigers_logo.svg/1024px-Auburn_Tigers_logo.svg.png",
            "https://upload.wikimedia.org/wikipedia/commons/thumb/1/12/Alabama_Athletics_logo.svg/1200px-Alabama_Athletics_logo.svg.png"),
  lat=c(32.5934,33.2140),
  lon=c(-85.4952,-87.5391)
)
custom.labels <-paste0("<b>",df$win,"</b><br>",
                      '<img src="', df$image, '" alt="these be unis" width="75"><br>', 
                      df$uni)

#plotting of map
leaflet(df) %>% 
  addTiles() %>% 
  addCircleMarkers(lng = ~lon,lat = ~lat,radius = df$uni) %>% 
  addPopups(lng = ~lon,lat = ~lat, 
            popup = lapply( custom.labels, htmltools::HTML ),            
            options = popupOptions(closeButton = FALSE,autoPan  =TRUE))