RShiny: How to center sliders

寵の児 提交于 2021-02-08 11:25:27

问题


I am new to RShiny and I am trying to replicate this template: https://shiny.rstudio.com/gallery/retirement-simulation.html I do have the code for this template but this is a learning exercise.

Here is what I have so far:

ui <- fluidPage(

  # Title goes here...
  titlePanel("Retirement: simulating wealth with random returns, inflation and withdrawals"),
  p("Description here..."),
  hr(),

  # Sidebar layout...
  sidebarLayout(
    # Sidebar panel...
    sidebarPanel(
      # Input: Slider for the number of observations to generate ----
      sliderInput("n",
                  "Param 1",
                  value = 500,
                  min = 1,
                  max = 1000),
      sliderInput("n",
                  "Param 2",
                  value = 500,
                  min = 1,
                  max = 1000),
      sliderInput("n",
                  "Param 3",
                  value = 500,
                  min = 1,
                  max = 1000),
      sliderInput("n",
                  "Param 4",
                  value = 500,
                  min = 1,
                  max = 1000)
    ),

    # Main panel...
    mainPanel(
      # Outputs of any plots...
      tabsetPanel(type = "tabs",
                  tabPanel("Plot", plotOutput("plot"))
      )
    )
  )
)

It looks good but I need the sliders to be centered just like the template above. Very grateful for pointers in the right direction!

Thanks,

Joesph


回答1:


Use margin: auto CSS rule:

div(style = "margin: auto; width: 80%", # this number can be any percentage you need
    sliderInput(
                ...
                width = "100%" # this number has to be "100%", nothing less
               )
   )




回答2:


You can do this by using a combination of wellPanel, fluidRow and column.

The first fluidRow is to hold the 2 wellPanels side by side with a 50% split. Within each of the wellPanels, we use fluidRows to define a row and then 2 columns with width 6 to define 2 columns of 50% width.

ui <- navbarPage("Test",

     tabPanel("Data",

              fluidRow(column(
                6,
                wellPanel(
                  fluidRow(column(
                    6, sliderInput("input1", "input1", 0, 100, 5)
                  ),
                  column(
                    6, sliderInput("input2", "input2", 0, 100, 5)
                  )),

                  fluidRow(column(
                    6, sliderInput("input1", "input3", 0, 100, 5)
                  ),
                  column(
                    6, sliderInput("input3", "input4", 0, 100, 5)
                  )),

                  fluidRow(column(
                    6, sliderInput("input1", "input5", 0, 100, 5)
                  ),
                  column(
                    6, sliderInput("input2", "input6", 0, 100, 5)
                  ))
                )
              ))))

The final output would look like this



来源:https://stackoverflow.com/questions/59229717/rshiny-how-to-center-sliders

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!