Leaflet polygons losing colour when R Shiny app opened in web browser

Question

I'm building a map using leaflet in R, to be deployed as a Shiny app. The Shiny app is working fine within RStudio, but when I open it in a web browser the polygons lose their colour. Everything else is fine, the base map is there, the polygons are all there, you can hover over the polygons to see information etc. The only change is that the polygons go from being colourful to all greyed out. No warnings or error messages.

I'm working on a mac (Sierra) with the newest versions of R (3.3.3) and Rstudio (1.0.136) and all my packages are up-to-date. I've tried two browsers with the same result (Chrome, Firefox). What's especially strange is that I tried opening the app on a Windows machine and encountered the opposite situation: No colours within Rstudio but full colours in a web browser (Firefox).

I'm guessing the problem is specifically with failing to read the fillColor option in addPolygons(), but I have no idea why there's a problem with this option specifically and why it works sometimes but not others. I would love to hear it if anyone has any ideas!

PS, I think my problem is similar to this (unanswered) question but again, it's puzzling that in my case it works within Rstudio but not in a web browser (or opposite on Windows machines apparently!).

Here's some code below (different dataset from the one I'm using and trimmed for clarity, but produces exactly the same behaviour as described above):

library(leaflet)
library(rgdal)
library(shiny)

server <- function(input,output){

  output$map <- renderLeaflet({

    # Example data (borrowed from a tutorial at https://rpubs.com/walkerke/leaflet_choropleth)
    tmp <- tempdir()
    url <- "http://personal.tcu.edu/kylewalker/data/mexico.zip"
    file <- basename(url)
    download.file(url, file)
    unzip(file, exdir = tmp)
    mexico <- readOGR(dsn = tmp, layer = "mexico", encoding = "UTF-8")

    leaflet(mexico) %>%
      addTiles() %>%
      addPolygons(weight = 1.2, label = ~name,
                  fillColor = topo.colors(4), fillOpacity = .5,
                  highlightOptions = highlightOptions(color = "black", weight = 2, bringToFront = TRUE, fillOpacity = .8)) %>%
      addProviderTiles("Esri.WorldPhysical")
  })
}

ui <- fluidPage(

  titlePanel("A map"),

  sidebarLayout(
    sidebarPanel("options go here"),
    mainPanel(
      leafletOutput("map", height = 600)
    )
  )
)

shinyApp(ui = ui, server = server)

Thanks!

Answer 1

topo.colors returns a hex representation of the colors with the alpha channel.

You can remove the alpha channel part by doing:

gsub(".{2}$","",topo.colors(4))

Not sure why the RStudio viewer pane can deal with the alpha and not chrome or firefox though.

Your leaflet call could be:

leaflet(mexico) %>%
      addTiles() %>%
      addPolygons(weight = 1.2, label = ~name,
                  fillColor = gsub(".{2}$","",topo.colors(4)), fillOpacity = .5,
                  highlightOptions = highlightOptions(color = "black", weight = 2, bringToFront = TRUE, fillOpacity = .8)) %>%
      addProviderTiles("Esri.WorldPhysical")