Wednesday, November 14, 2018

javascript - Absolute panel in R shiny gets hidden behind the leaflet output




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

plot explanation - Why did Peaches' mom hang on the tree? - Movies & TV

In the middle of the movie Ice Age: Continental Drift Peaches' mom asked Peaches to go to sleep. Then, she hung on the tree. This parti...