I'm currently developing an app that features a scrollable sidebarPanel alongside a mainPanel that can have varying heights, such as:
library(shiny)
ui <- fluidPage(
headerPanel('Iris k-means clustering'),
sidebarPanel(style = "overflow-y:scroll; max-height: 600px; position:relative;",
numericInput('clusters', 'Cluster count', 3, min = 1, max = 9),
selectInput('xcol', 'X Variable', names(iris)),
selectInput('xcol', 'X Variable', names(iris)),
selectInput('xcol', 'X Variable', names(iris)),
selectInput('xcol', 'X Variable', names(iris)),
selectInput('xcol', 'X Variable', names(iris)),
selectInput('xcol', 'X Variable', names(iris)),
selectInput('xcol', 'X Variable', names(iris)),
selectInput('xcol', 'X Variable', names(iris)),
selectInput('xcol', 'X Variable', names(iris)),
selectInput('xcol', 'X Variable', names(iris)),
selectInput('ycol', 'Y Variable', names(iris),
selected = names(iris)[[2]])
),
mainPanel(
plotOutput('plot1'),
conditionalPanel("input.clusters == 2",
plotOutput('plot2')
)
)
)
server <- function(input, output) {
output$plot1 <- renderPlot({
plot(x=iris$Sepal.Length, iris$Sepal.Width,
col = iris$Species, pch = 20, cex = 3)
})
output$plot2 <- renderPlot({
plot(x=iris$Petal.Length, iris$Petal.Width,
col = iris$Species, pch = 20, cex = 3)
})
}
shinyApp(ui = ui, server = server)
As the height of the mainPanel changes when cluster equals 2, I am wondering if there is a way to make the height of the sidebar automatically adjust to match the mainPanel output. This would ensure that the sidebar always reaches the bottom of the page while still being scrollable.
I suspect it has something to do with the max-height css parameter, but I'm unsure how to proceed from here.
Any suggestions would be greatly appreciated!