I am trying to make a leaflet map full screen and also add filter controls on top of the map. However, when I try to do this my filter control(absolute panel) gets hidden behind the leaflet output during runtime.
Absolute panel is present when I give width manually
I want the map to be full-screen , when I do it, it gets hidden behind the map.
How can I make the map go behind the absolute panel?
Any help is appreciated.
Thanks
Below is the UI code:
fluidPage(style="padding-top: 10px;",
h1("Locations"),
absolutePanel(
top = 60, left = "auto", right = 20, bottom = "auto",
width = 330, height = "auto",draggable = TRUE,
wellPanel(
selectInput("Suburb", "Select one Suburb:",choices = c("Select one Suburb" = "All", as.character(mydata$SuburbTown))),
uiOutput("secondselection")
),
style = "opacity: 0.65"
),
leafletOutput("leafl", height = "800px")
)
Answer
You can change the z-index
of your panel to make it work.
Try this:
fluidPage(style="padding-top: 10px;",
h1("Locations"),
absolutePanel(
top = 60, left = "auto", right = 20, bottom = "auto",
width = 330, height = "auto",draggable = TRUE,
wellPanel(
selectInput("Suburb", "Select one Suburb:",choices = c("Select one Suburb" = "All", as.character(mydata$SuburbTown))),
uiOutput("secondselection")
),
style = "opacity: 0.65; z-index: 10;" ## z-index modification
),
leafletOutput("leafl", height = "800px")
)
No comments:
Post a Comment