2 issues with addPopupImages - local image distortion; problem loading file

[lizard12995]

Hi! Somewhat new to this, so please let me know how to make this example more helpful.

I'm having two problems using addPopupGraphs(). I've tried a few experiments to figure out where things are going wrong and I've realized that one of the major issues is with the IMAGES themselves. All of the images I use are fine when I pull them up on my desktop, but when I load them via leafpop on a map, they look distorted, like this:

For more context, I am taking a batch of photos, pulling the metadata using exifr, and then trying to plot all of the photos on a map.

Here's my attempt at a reproducible example:

load packages...

library(exifr)
library(dplyr)
library(leaflet)
library(readr)
library(mapview)
library(sf)
library(leafpop)

My actual dataset was created by getting the metadata from 173 photos - one (IMG_0319.JPG) is attached.

files <- list.files(pattern = "*.JPG")
dat <- read_exif(files)

dat2 <- select(dat,
               SourceFile, DateTimeOriginal,
               GPSLongitude, GPSLatitude,
               GPSTimeStamp)

projcrs <- "+proj=longlat +datum=WGS84 +no_defs +ellps=WGS84 +towgs84=0,0,0"
dat3 <- st_as_sf(x = dat2,
                 coords = c("GPSLongitude","GPSLatitude"),
                 crs = projcrs)

I tried this with 3 options - a photo from the web, a column of image names that are stored in my wd, and I tried putting the image on my desktop and including the file path:

img = "http://bit.ly/1TVwRiR"
img2 = "dat3$SourceFile"
img3 = "[file path]"

Here, problem 1 occurs with image distortion (also, the image is very big!):

leaflet(dat3) %>%
  addTiles() %>%
  addCircleMarkers(group = "dat3") %>%
  addPopupImages(dat2$SourceFile, group = "dat3")

Here, problem 2 occurs: entering img, img2, or img3 makes it such that NO pop-up comes up at all:

leaflet(dat3) %>%
  addTiles() %>%
  addCircleMarkers(group = "dat3") %>%
  addPopupImages(img3, group = "dat3")

No pop-ups come up if I directly enter a file path:

leaflet(dat3) %>%
  addTiles() %>%
  addCircleMarkers(group = "dat3") %>%
  addPopupImages("C:/Users/Austin Paralegal/Desktop/me.JPG", group = "dat3")

A few other random experiments...

Here, it works with a local image that is NOT one of the images I'm analyzing:

leaflet(dat2) %>%
  addProviderTiles("Esri.WorldImagery") %>%
  addCircleMarkers(lng = ~GPSLongitude, lat = ~GPSLatitude,
                   popup = popupImage("file/path/for/local/imageNOT/IMG_0319", src = "local"),
                   options = markerOptions(opacity = 0.9, draggable = T))

Here, the pop-ups work, but the images are distorted:

leaflet(dat2) %>%
  addProviderTiles("Esri.WorldImagery") %>%
  addCircleMarkers(lng = ~GPSLongitude, lat = ~GPSLatitude,
             popup = popupImage(as.character(dat2$SourceFile), src = "local"),
             options = markerOptions(opacity = 0.9, draggable = T))

One image I'm using:

[tim-salabim]

Can you please share your sessionInfo() ? I have no problem with that photo you provided here.

[lizard12995]

R version 3.6.1 (2019-07-05)
Platform: i386-w64-mingw32/i386 (32-bit)
Running under: Windows >= 8 x64 (build 9200)

Matrix products: default

locale:
[1] LC_COLLATE=English_United States.1252  LC_CTYPE=English_United States.1252   
[3] LC_MONETARY=English_United States.1252 LC_NUMERIC=C                          
[5] LC_TIME=English_United States.1252    

attached base packages:
[1] stats     graphics  grDevices utils     datasets  methods   base     

other attached packages:
[1] leafpop_0.0.4      sf_0.7-6           mapview_2.7.0      RColorBrewer_1.1-2 readr_1.3.1       
[6] leaflet_2.0.2      dplyr_0.8.3        exifr_0.3.1       

loaded via a namespace (and not attached):
 [1] DBI_1.0.0          gdtools_0.1.9      class_7.3-15       promises_1.0.1    
 [5] tidyselect_0.2.5   lattice_0.20-38    brew_1.0-6         pkgconfig_2.0.2   
 [9] compiler_3.6.1     htmlwidgets_1.3    viridisLite_0.3.0  xtable_1.8-4      
[13] png_0.1-7          Rcpp_1.0.1         shiny_1.3.2        units_0.6-3       
[17] tools_3.6.1        uuid_0.1-2         R6_2.4.0           purrr_0.3.2       
[21] raster_2.9-23      crosstalk_1.0.0    scales_1.0.0       assertthat_0.2.1  
[25] digest_0.6.20      svglite_1.2.2      mime_0.7           KernSmooth_2.23-15
[29] rstudioapi_0.10    backports_1.1.4    htmltools_0.3.6    hms_0.5.0         
[33] munsell_0.5.0      grid_3.6.1         colorspace_1.4-1   glue_1.3.1        
[37] httpuv_1.5.1       rlang_0.4.0        magrittr_1.5       rappdirs_0.3.1    
[41] vctrs_0.2.0        classInt_0.3-3     stats4_3.6.1       zeallot_0.1.0     
[45] satellite_1.0.1    crayon_1.3.4       sp_1.3-1           e1071_1.7-2       
[49] later_0.8.0        pillar_1.4.2       base64enc_0.1-3    codetools_0.2-16  
[53] webshot_0.5.1      tibble_2.1.3      
> 

[tim-salabim]

Thanks! Can you please try the following reprex, only reading the one file you attached here (obviously you need to change the path argument in list.files) and let me know if the issue still persists:

library(exifr)
library(dplyr)
library(leaflet)
library(readr)
library(mapview)
library(sf)
library(leafpop)

files <- list.files(path = "C:/Users/Tim/Downloads", pattern = glob2rx("616*.JPG"),
                    full.names = TRUE)
dat <- read_exif(files)

dat2 <- select(dat,
               SourceFile, DateTimeOriginal)
dat2$GPSLongitude = st_coordinates(breweries)[1, "X"]
dat2$GPSLatitude = st_coordinates(breweries)[1, "Y"]

projcrs <- "+proj=longlat +datum=WGS84 +no_defs +ellps=WGS84 +towgs84=0,0,0"
dat3 <- st_as_sf(x = dat2,
                 coords = c("GPSLongitude","GPSLatitude"),
                 crs = projcrs)

leaflet(dat3) %>%
    addTiles() %>%
    addCircleMarkers(group = "dat3") %>%
    addPopupImages(dat2$SourceFile, group = "dat3")

[lizard12995]

Tried your reprex and still got this! What could it be?

[tim-salabim]

Here's what I get:

It seems that yours is rotated, I don't know why though. I am wondering if that is causing the issue.

[lizard12995]

Maybe something my computer is doing to the files? When I open it on my photo viewer it rotates it automatically.

[tim-salabim]

Did you try downloading the one you attached here again and plot that?

[lizard12995]

Yes I did. My computer corrected it to vertical once I re-downloaded it. So, it looks like all the horizontal photos are working, it's just the vertical ones that get distorted.

edited: Windows 10 auto-rotates pictures and it seems like there is no clear way to disable it https://answers.microsoft.com/en-us/windows/forum/windows_10-other_settings/disable-photo-auto-rotate-win-10/f4f56e93-ad1d-4969-87a4-a0a0b4f3a41b?page=1

[tim-salabim]

I am also on windows 10 and don't have that problem... Did you do anything else to the photo?

[lizard12995]

No, nothing. Just downloaded the one I had uploaded here. Didn't touch any of the other photos either.

[tim-salabim]

I am out of ideas then... sorry

[tim-salabim]

Closing here, please feel free to re-open if there's anything else we should try