首页 > 解决方案 > 调整 Html 表格大小以适应屏幕 RSHINY

问题描述

如何调整 HTML 表格的大小以适应计算机的屏幕?这就是我闪亮的应用程序目前的外观现在闪亮的应用程序界面,我尝试使用流畅的行列,但它没有给我正确的结果。我想我在这里遗漏了一些东西。

这是我闪亮的服务器和用户界面

用户界面


library("shiny")
library(daff)
library(dplyr)
library(shinythemes)
setwd("PATH")
ui <- fluidPage(theme = shinytheme("cerulean"),
  fluidPage(
    titlePanel("Automated Data Dictionary Comparison"),
    sidebarLayout(

      sidebarPanel(

        selectInput(inputId = 'Dic1',
                    label = 'Choose First Data Dictionary:',

                    choices = list.files(path = "./data",
                                         full.names = FALSE,
                                         recursive = FALSE)),
        selectInput(inputId = 'Dic2',
                    label = 'Choose Second Data Dictionary:',
                    choices = list.files(path = "./data",
                                         full.names = FALSE,
                                         recursive = FALSE))
      ),

      mainPanel(
         uiOutput('contents'))

    )
  )
)

Html 表在输出部分。服务器.R

library(shiny)
library(dplyr)
library(daff)
library(shinythemes)
setwd("PATH")
server <-  function(input, output) {
   # Parse first file
   dataset1 <- reactive({

      infile <- input$Dic1

      if (is.null(infile)){
         return(NULL)
      }
      x <- read.csv(paste0("./data/", infile[[1]]))
      x
   })
   # Parse second file
   dataset2 <- reactive({
      infile <- input$Dic2

      if (is.null(infile)){
         return(NULL)
      }
      x <- read.csv(paste0("./data/", infile[[1]]))
      x
   })
   # Create comparison table (reactive as both of its elements are reactive)
   diff <- reactive({
      x <- render_diff(diff_data(data_ref=dataset1(), data=dataset2()),use.DataTables=TRUE)
      x
   })
   #Output
   output$contents <- renderUI({
      HTML(diff())

   })
}

预期的结果是我的表格可以在屏幕上完全看到而不是扩展我必须滚动才能在屏幕外看到整个表格

标签: rshinyshinydashboardshinyapps

解决方案


试试用这个

                mainPanel(

                  HTML("<div style ='overflow:auto;  ' >"),
                  uiOutput('contents'),
                  HTML("</div>")

                )

或尝试设置heightwidth使用 css设置

                mainPanel(

                  HTML("<div style ='overflow:auto; height:500px ' >"),
                  uiOutput('contents'),
                  HTML("</div>")

                )

推荐阅读