R闪亮的仪表板输出面板问题

时间:2018-11-20 05:07:15

标签: r shiny shinydashboard

我用闪亮的方式创建了以下仪表板

我首先在R中导入folloiwng库

 library(shinydashboard)
 library(shiny)
 library(DT)
 library(shinyWidgets)
 library(readxl)

我们首先在此处创建UI,以提供日期,文件导入,数字输入和操作按钮

  ui=shinyUI(
  dashboardPage(
  dashboardHeader(

  title = "Chart",
  titleWidth = 850
   ),
  dashboardSidebar(   


  # Change font size here



     tags$head( 
     tags$style(HTML(".main-sidebar { font-size: 20px; }"), style = 
     "background-color: #78d9c9;") #change the font size to 20
      ),



     fileInput(inputId = "file", label = 'Load Dataset Here',placeholder = 
    "Upload",
            multiple = TRUE,
            accept = c("xlsx/xls",".xls",".xlsx"), width = "100%"),
         dateInput(inputId = 'Cutoffdate',label =  'Cut Off date'), 

     numericInput(inputId = 'AAA',label =  'AAA', value = 0, min = 0, max = 
    120, step = 6),# Add new font color here

      actionButton(inputId = 'Button',label ='Generate Chart', style="color: 
  #fff; background-color: #599AC3; border-color: #2e6da4, :font-color: 
  black")
   ),
dashboardBody(

  tags$head(tags$style(HTML('
                            /* logo */
                            .skin-blue .main-header .logo {
                            background-color:   #7CFC00;
                            }

                            /* logo when hovered */
                            .skin-blue .main-header .logo:hover {
                            background-color:   #7CFC00;
                            }

                            /* navbar (rest of the header) */
                            .skin-blue .main-header .navbar {
                            background-color:   #7CFC00;
                            }

                            # Sidebar color here
                            /* main sidebar */
                            .skin-blue .main-sidebar {
                            background-color:   #F4A460;
                            }

                            /* active selected tab in the sidebarmenu */
                            .skin-blue .main-sidebar .sidebar .sidebar-menu 
          .active a{
                            background-color: #FFF8DC;
                            }

                            /* other links in the sidebarmenu */
                            .skin-blue .main-sidebar .sidebar .sidebar-menu 
                       a{
                            background-color: #FFF8DC;
                            color:#A9A9A9;
                            }

                            /* other links in the sidebarmenu when hovered 
                         */
                            .skin-blue .main-sidebar .sidebar .sidebar-menu 
                            a:hover{
                            background-color: #FFF8DC;
                            }
                            /* toggle button when hovered  */
                            .skin-blue .main-header .navbar .sidebar- 
                            toggle:hover{
                            background-color: #FFF8DC;
                            }

                            /* body */
                            .content-wrapper, .right-side {
                            background-color: #FFF8DC;
                            }

                            '))



                       ),

                      mainPanel(

                    fluidRow(
                   column(12,plotlyOutput("plot1" , height = 600, 
                   width=1200))

                    ), fluidRow(  column(7,tableOutput(outputId = 
                    "Table2"))),



                      fluidRow(column(12,dataTableOutput(outputId = 
                      "Table1")))


                       )


                       )


                       )
                       )

接下来我们创建一个服务器

     server<-function(input, output){


    output$Table1<-renderDataTable({airquality}) 

   #output$plot1<-renderPlot({hist(airquality$Ozone)})

    output$Table2<-renderTable({airquality})




 }
shinyApp(ui, server =server)

主面板中的彩色背景并未一直向下延伸。第二张桌子放置在白色背景上。有没有办法扩大输出面板的尺寸来做到这一点

1 个答案:

答案 0 :(得分:0)

解决方案很简单。只需删除UI中的mainpanel()即可。