Black Lives Matter. Please consider donating to Black Girls Code today.
Learn how to use COVID-19 data in open source Dash apps. Register for the Sept 23rd webinar with IQT!

Logos on maps only display underneath the map

I’d like to embed logos in a plot that contains a map in R, but I can’t seem to get the logos to display above the map. For example, modifying the code just a bit from https://plot.ly/r/logos/ (replacing “plot_ly” with “plot_geo”), I go from this:

To this

In the latter image, you can just barely see the upper left logo sticking out from behind the map. Adding the layer = “above” argument doesn’t fix this. Any suggestions would be greatly appreciated.

Hmm. I got this to work with the latest plotly.js http://codepen.io/etpinard/pen/GWwRdv

Maybe you’re using an old version of the R api.

Thanks for the suggestion. I was using the latest CRAN build of the plotly package in R, and I just installed the latest development version (4.5.6.9000). Unfortunately this issue still persists.

devtools::install_github("ropensci/plotly")
library(plotly)

p <- plot_geo(x = c(1, 2, 3), y = c(1, 2, 3)) %>%
  add_lines() %>%
  layout(
    images = list(
      list(source = "https://images.plot.ly/language-icons/api-home/python-logo.png",
           xref = "paper",
           yref = "paper",
           x= 0.5,
           y= 0.5,
           sizex = 0.2,
           sizey = 0.2
      )
    )
  )
p

EDIT: It appears that this may not work in the RStudio environment but display correctly once the plot is uploaded to the web.

Oh right. The R library version on CRAN uses an outdated version of plotly.js. I believe a new version is coming out soon cc @carson

Yep, the dev (Github) version should update to the latest plotly.js by next
week. Also, I’m shooting for a CRAN release within the next 2-3 weeks.

Great to know, thank you. However, I am flummoxed by the fact that sometimes logo images display fine and other times they do not. For example, using the code that you used above (http://codepen.io/etpinard/pen/GWwRdv), if I take the image used in that example (python-logo.png), download it, and then re-upload it to a random image hosting site, it does not work.

Here’s a different URL to the same image, but the image does not display if this URL used in the above code:

https://image.ibb.co/cK8Mva/python_logo_1.png

Thanks in advance for any thoughts on this.