Plotly's fillcolor defaults to half-transparency, want no-transparency

Question

I am trying to build a map in R using plotly. I will share the code required to build the dataframe in a reply to this post. Here is the code I am using to plot the chart:

Answer 1

Without modifying anything in Plotly, I found that you can add

alpha = 1

to add_trace/add_polygons to change it to completely opaque. So where you have your fillcolor comment, you can drop in

alpha = 

then 0-1, completely transparent to completely opaque.

Answer 2

I digged a bit into plotly and did not find a direct solution to this. However, we can use the function prependContent from the htmlwidgets package to tweak the rendered plot. Here is a simple example:

library(plotly)
library(dplyr)
library(htmlwidgets)
library(htmltools)

# define utility function to adjust fill-opacity using css
fillOpacity <- function(., alpha = 0.5) {
  css <- sprintf("<style> .js-fill { fill-opacity: %s !important; } </style>", alpha)
  prependContent(., HTML(css))
}


ggplot2::map_data("world") %>%
  group_by(group) %>%
  plot_ly(x = ~long, y = ~lat) %>%
  add_polygons() %>%
  fillOpacity(alpha = 1)

We basically inject some CSS into the widget container and use !important in order to make sure the styles wont be overwritten.

Here you can see the results for alpha = 0, 0.25, 0.75 and 1: