居中 rHandsontableOutput - 闪亮

Centering rHandsontableOutput - Shiny

我正在尝试将使用 rhandsontable 创建的两个表居中放置在列中并得到两个 weirdly split tables:

当我不尝试居中时,一切都是fine。

有谁知道出了什么问题以及如何使我的表格居中?

这是我的 MWE:

rm(list=ls())
library(shiny)
library(rhandsontable)

# Create initial data frames 
x1 <- x2 <- x3 <- x4 <- data.frame(v1=c(1,2), v2 <- c(3,4))

# Server
server <- shinyServer(function(input, output, session) {

  # Data frame 1 to hot 
  previousX1 <- reactive({x1})
  changeX1 <- reactive({
    if(is.null(input$hot_x1)){return(previousX1())}
    else{X1 <- as.data.frame(hot_to_r(input$hot_x1))
    # Perform some operations on X1
    }
  })
  output$hot_x1 <- renderRHandsontable({rhandsontable(changeX1())})

  # Data frame 2 to hot
  previousX2 <- reactive({x2})
  changeX2 <- reactive({
    if(is.null(input$hot_x2)){return(previousX2())}
    else{X2 <- as.data.frame(hot_to_r(input$hot_x2))
    # Perform some operations on X2
    }
  })
  output$hot_x2 <- renderRHandsontable({rhandsontable(changeX2())})

  # Data frame 3 to hot
  previousX3 <- reactive({x3})
  changeX3 <- reactive({
    if(is.null(input$hot_x3)){return(previousX3())}
    else{X3 <- as.data.frame(hot_to_r(input$hot_x3))
    # Perform some operations on X3
    }
  })
  output$hot_x3 <- renderRHandsontable({rhandsontable(changeX3())})

  # Data frame 4 to hot
  previousX4 <- reactive({x4})
  changeX4 <- reactive({
    if(is.null(input$hot_x4)){return(previousX4())}
    else{X4 <- as.data.frame(hot_to_r(input$hot_x4))
    # Perform some operations on X2
    }
  })
  output$hot_x4 <- renderRHandsontable({rhandsontable(changeX4())})
})

# User interface
ui <- shinyUI(fluidPage(
  navbarPage("MWE",
  tabPanel("Center",
            fluidRow(
              column(width=12, align="center", "Alignment (center) with split")),
            fluidRow(
              column(width = 6, align="center", rHandsontableOutput("hot_x1")),
              column(width = 6, align="center", rHandsontableOutput("hot_x2")))
           ),

  tabPanel("Left",

            fluidRow(
              column(width=12, align="center", "Alignment (left) without split")),
            fluidRow(
              column(width = 6, rHandsontableOutput("hot_x3")),
              column(width = 6, rHandsontableOutput("hot_x4")))
           )

  , fluid=TRUE)))

  shinyApp(ui=ui, server=server)

我不确定为什么您的 table 在使用 align="center" 时存在分歧;也许这是你应该 post here.

尽管如此,这里有一个使用 offset 的解决方法:

library(shiny)
library(rhandsontable)

# Create initial data frames
x1 <- data.frame(v1 = c(1, 2), v2 <- c(3, 4))

# Server
server <- shinyServer(function(input, output, session) {

  # Data frame 1 to hot
  previousX1 <- reactive({
    x1
  })

  changeX1 <- reactive({
    if (is.null(input$hot_x1)) {
      return(previousX1())
    }
    else{
      X1 <- as.data.frame(hot_to_r(input$hot_x1))
      # Perform some operations on X1
    }
  })

  output$hot_x6 <- output$hot_x5 <- output$hot_x4 <- output$hot_x3 <- output$hot_x2 <- output$hot_x1 <- renderRHandsontable({
      rhandsontable(changeX1())
    })

})



# User interface
ui <- shinyUI(fluidPage(navbarPage(
  "MWE",
  tabPanel("Center",
           fluidRow(
             column(
               width = 12,
               align = "center",
               "Alignment (center) with split"
             )
           ),
           fluidRow(
             column(
               width = 6,
               align = "center",
               rHandsontableOutput("hot_x1")
             ),
             column(
               width = 6,
               align = "center",
               rHandsontableOutput("hot_x2")
             )
           )),

  tabPanel("Left",
           fluidRow(
             column(
               width = 12,
               align = "center",
               "Alignment (left) without split"
             )
           ),
           fluidRow(
             column(width = 6, rHandsontableOutput("hot_x3")),
             column(width = 6, rHandsontableOutput("hot_x4"))
           )),

  tabPanel("Offset",
           fluidRow(
             column(
               width = 12,
               align = "center",
               "column offset without split"
             )
           ),
           fluidRow(
             column(
               width = 4,
               offset = 2,
               rHandsontableOutput("hot_x5")
             ),
             column(
               width = 4,
               offset = 2,
               rHandsontableOutput("hot_x6")
             )
           )),
  fluid = TRUE
)))

shinyApp(ui = ui, server = server)

如果一个页面只有一个table,并且table有一个固定的with,你可以center with:

style = "margin-left: calc(50vw - 400px); margin-right: calc(50vw - 400px);"

例如:

df = ... some data frame ...

ui <- fluidPage(
  br(),

  style = "margin-left: calc(50vw - 400px); margin-right: calc(50vw - 400px);",
  rHandsontableOutput('table')
)

server = function(input, output, session) 
{
  output$table <- renderRHandsontable({
    rhandsontable(df, width = 800)
  })
}

shinyApp(ui, server)