I am rendering some leaflet maps in my shiny app and the problem is that the legend of the map is not displayed correctly and legend items are aligned very weirdly (image 2). I create the same map in R studio and in the Rstudio Viewer, legend items alignment is correct (image 1).
I have tried using CSS tags in my shiny code to customize the legend, but nothing works.
Here is sample code to show how I am rendering leaflet plot (and also the CSS tags examples I've tried). I dont know why the items are displayed like this. I would really appreciate your help on this.
...
tabPanel("plot",
tagList(
tags$head(
tags$style(
".leaflet .legend {width:200px; text-align: left;}",
".leaflet .legend i{float: left;}",
".leaflet .legend label{float:left; text-align: left;}"
)
)
),
leafletOutput("leaflet_plot", width = 800, height = 550)
)
...
# code to create leaflet
output$leaflet_plot <- renderLeaflet({
pal <- c("#F1F1F1", brewer.pal(5, "YlOrBr"))
opts <- providerTileOptions(opacity = 0)
map <- leaflet(shape_file) %>% addProviderTiles("CartoDB.PositronNoLabels", options = opts)
map <- map %>% addPolygons(fillColor = ~colorFactor(pal, shape_file$var)(var)
map <- map %>% addLegend("bottomleft", title = "Employment/Acre", pal = colorFactor(pal, NULL), values = ~var)
map
})
Thanks,
Ashish
