简体   繁体   中英

R Shiny ValueBox and Table layout

I am building one UI in R Shiny and struggling with the layout part. I want to plot ValueBoxes and Table together. Following is the current output but, the rows are coming with the gap. So, could you suggest what can be done to remove this gap and get the desired layout. Here is the code

  tabItem("overall_current_performance",

          fluidRow(

            column(width = 12,
                   valueBoxOutput("vlue", width = 3),
                   valueBoxOutput("vlue1", width = 3),
                   valueBoxOutput("win_loose", width = 3),
                   box(
                     title = "Box title", width = 3, 
                     div(style = "height:200px"), status = "primary",
                     "Box content"
                   )
                   ),

            column(width = 12,
                   valueBoxOutput("performance", width = 3),
                   valueBoxOutput("performance1", width = 3),
                   valueBoxOutput("win_loose1", width = 3)
                   )
          )

  )

Current Layout with row gap:

当前布局

Following changes gives correct layout,

   column(
      width = 3,
             valueBoxOutput(
                    "vlue", width = NULL
                   ),
                   valueBoxOutput(
                    "vlue1", width = NULL
                   )
            ),

            column(width = 3,
                   valueBoxOutput(
                     "performance", width = NULL
                   ),
                   valueBoxOutput(
                     "performance1", width = NULL
                   )
            ),

            column(width = 3,
                   valueBoxOutput(
                     "win_loose", width = NULL
                   ),
                   valueBoxOutput(
                     "win_loose1", width = NULL
                   )
            ),

            column(width = 3,
                   box(
                     title = "Box title", width = NULL, div(style = "height:150px"), 
                     status = "primary","Box content"
                   )

Desired Layout:

所需布局

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM