CODEWITHSUNDEEP
rshiny
tee
tee

Reputation: 45

R Shiny: Fix fluid page column, e.g. to make it immune to scrolling

my current shiny app works well, but I'm using a fluid page environment as such:

    ui.R
    ----
    shinyUI(fluidPage(

     fluidRow(
              column(3,
                     ...long list of inserts...
                    ),

              column(3,
                     ... list of a few insterts...
                    ),

              column(6,
                     ... plot ...
                    )
      ))

Now since in the first column there's such a long list of inserts, I'd like to fix the plot output in place, so it scrolls down with the screen. Any ideas? Is fluid page the wrong environment for that?

Upvotes: 1

Views: 2299

Answers (2)

SOwla
SOwla

Reputation: 386

I'm new to Shiny/R, but I think you can also use a fixedPanel :) https://shiny.rstudio.com/reference/shiny/latest/absolutePanel.html

Here's an edited version of mlegge's code that also works for me, using fixedPanel :)

library("shiny")
library("ggplot2")

server <- function(input, output, session) {
    output$plot <- renderPlot({
        ggplot(iris, aes(Sepal.Width, Sepal.Length)) + geom_point()
    })
}

long_list <- do.call(tagList, lapply(seq(50), function(ix) {
    id <- paste0("x", ix)
    numericInput(id, id, 1L)
}))

short_list <- do.call(tagList, lapply(seq(10), function(ix) {
    id <- paste0("y", ix)
    numericInput(id, id, 1L)
}))

ui <- fluidPage(
    fluidRow(
        column(3, long_list),
        column(3, short_list),
        column(6, fixedPanel(top = 10, right = 10, width = "45%", plotOutput("plot")))
    )
)

shinyApp(ui = ui, server = server)

Upvotes: 1

mlegge
mlegge

Reputation: 6913

You can use Bootstrap's data-spy directive and affix class:

library("shiny")
library("ggplot2")

server <- function(input, output, session) {
  output$plot <- renderPlot({
    ggplot(iris, aes(Sepal.Width, Sepal.Length)) + geom_point()
  })
}

long_list <- do.call(tagList, lapply(seq(50), function(ix) {
  id <- paste0("x", ix)
  numericInput(id, id, 1L)
}))

short_list <- do.call(tagList, lapply(seq(10), function(ix) {
  id <- paste0("y", ix)
  numericInput(id, id, 1L)
}))

ui <- fluidPage(
  tags$head(
    tags$style(HTML("

     .affix {
        top:50px;
        position:fixed;
      }

    "))
  )

  , fluidRow(
    column(3, long_list),
    column(3, short_list),
    column(6, div(`data-spy`="affix", `data-offset-top`="5", plotOutput("plot")))
  )
)

shinyApp(ui = ui, server = server)

enter image description here

Upvotes: 2

Related Questions