在Shiny主面板中右对齐元素

rso*_*ren 7 r alignment shiny

我有一个带左侧边栏的Shiny应用程序,我想将mainPanel中的图形对齐到右侧.我已经尝试添加style = "align:right"到mainPanel中的每个元素,以及包装我能想到的所有内容div(..., style = "align:right").这些都没有效果.

您可以在RStudio库中使用此示例.我想将"表"选项卡中的输出对齐到右侧.这是ui.R的相关部分:

mainPanel(
  tabsetPanel(type = "tabs", 
    tabPanel("Plot", plotOutput("plot")), 
    tabPanel("Summary", verbatimTextOutput("summary")), 
    tabPanel("Table", tableOutput("table"))
  )
)
Run Code Online (Sandbox Code Playgroud)

jdh*_*son 10

您可以向Table选项卡添加类.在这种情况下,我已经添加了一个rightAlign类.tabPanel("Table", tableOutput("table"), class = 'rightAlign')然后,您可以使用CSS之类的任何常用方式http://shiny.rstudio.com/articles/css.html设置此选项卡.rightAlign{float:right;}的样式.

library(shiny)
runApp(list(
  ui = fluidPage(
    tags$head(tags$style(".rightAlign{float:right;}")),
    titlePanel("Tabsets"),
    sidebarLayout(
      sidebarPanel(
        radioButtons("dist", "Distribution type:",
                     c("Normal" = "norm",
                       "Uniform" = "unif",
                       "Log-normal" = "lnorm",
                       "Exponential" = "exp")),
        br(),
        sliderInput("n", 
                    "Number of observations:", 
                    value = 500,
                    min = 1, 
                    max = 1000)
      ),
      mainPanel(
        tabsetPanel(type = "tabs", 
                    tabPanel("Plot", plotOutput("plot")), 
                    tabPanel("Summary", verbatimTextOutput("summary")), 
                    tabPanel("Table", tableOutput("table"), class = 'rightAlign')
        )
      )
    )
  )
  , server = function(input, output) {
    data <- reactive({
      dist <- switch(input$dist, norm = rnorm, unif = runif,
                     lnorm = rlnorm, exp = rexp, rnorm)
      dist(input$n)
    })
    output$plot <- renderPlot({
      dist <- input$dist
      n <- input$n
      hist(data(), main=paste('r', dist, '(', n, ')', sep=''))
    })
    output$summary <- renderPrint({
      summary(data())
    })
    output$table <- renderTable({
      data.frame(x=data())
    })
  }
)
)
Run Code Online (Sandbox Code Playgroud)

在此输入图像描述