CODEWITHSUNDEEP
rshinyr-markdownflexdashboard
neversaint
neversaint

Reputation: 64004

How to extend the renderTable width in Shiny flexdashboard

I have the following self containing Shiny-Flexdashboard:

---
title: "FOO"
runtime: shiny
output: 
  flexdashboard::flex_dashboard:
    vertical_layout: scroll
    orientation: rows
    theme:   default

---

```{r setup, include=FALSE}
library(flexdashboard)
library(tidyverse)
```

Rows
-------------------------------------

### Statistical Test Summary
```{r stat_test_table}
mainPanel(

  renderTable( {
      dat <- df <- structure(list(`Sample name` = structure(1:3, .Label = c("Sample1", 
          "Sample2", "Sample3"), class = "factor"), `FDR correction (mean)` = c(5.93070861978308e-15, 
         6.88632524238004e-13, 3.28339498763286e-16), `FDR correction (sd)` = c(2.00046170407461e-14, 
        2.32019633515427e-12, 1.10782095003689e-15), `P-value (mean)` = c(5.55365134900322e-15, 
        6.44757191496266e-13, 3.07475941705412e-16), `P-value (sd)` = c(1.98732517127302e-14, 
        2.30494707691577e-12, 1.10054774779699e-15)), class = c("tbl_df", 
        "tbl", "data.frame"), .Names = c("Sample name", "FDR correction (mean)", 
        "FDR correction (sd)", "P-value (mean)", "P-value (sd)"), row.names = c(NA,  -3L))
  }
  , digits=-2, width = '100%'
  )
)
```

It produces table like this:

enter image description here

As stated there how can I extend the column width?

Upvotes: 7

Views: 3850

Answers (3)

Charlotte Hadley
Charlotte Hadley

Reputation: 818

I think it's important to note that mainPanel is not designed for your use case here. This is the "correct" usage of mainPanel and why there is the default width = 8

sidebarLayout(
  sidebarPanel(sliderInput("thing", "Thing", min = 0, max = 5, value = 4)),
  mainPanel(
    renderDataTable( {

    input$Thing
      dat <- df <- structure(list(`Sample name` = structure(1:3, .Label = c("Sample1", 
          "Sample2", "Sample3"), class = "factor"), `FDR correction (mean)` = c(5.93070861978308e-15, 
         6.88632524238004e-13, 3.28339498763286e-16), `FDR correction (sd)` = c(2.00046170407461e-14, 
        2.32019633515427e-12, 1.10782095003689e-15), `P-value (mean)` = c(5.55365134900322e-15, 
        6.44757191496266e-13, 3.07475941705412e-16), `P-value (sd)` = c(1.98732517127302e-14, 
        2.30494707691577e-12, 1.10054774779699e-15)), class = c("tbl_df", 
        "tbl", "data.frame"), .Names = c("Sample name", "FDR correction (mean)", 
        "FDR correction (sd)", "P-value (mean)", "P-value (sd)"), row.names = c(NA,  -3L))
  }
  )
  )
)

Furthermore, you'll have much more flexibility with your tables if you use DT::renderDataTable which you may read about here https://rstudio.github.io/DT/

In fact, by default this takes 100% of the browser window width without needing a wrapper. You might consider using fillPage and fluidPage in your flexdashboards to control the size/area dedicated to individual elements.

---
title: "FOO"
runtime: shiny
output: 
  flexdashboard::flex_dashboard:
    vertical_layout: scroll
    orientation: rows
    theme:   default

---

```{r setup, include=FALSE}
library(flexdashboard)
library(tidyverse)
library(DT)
```

Rows
-------------------------------------

### Statistical Test Summary

```{r}
DT::renderDataTable( {

    input$Thing
      dat <- df <- structure(list(`Sample name` = structure(1:3, .Label = c("Sample1", 
          "Sample2", "Sample3"), class = "factor"), `FDR correction (mean)` = c(5.93070861978308e-15, 
         6.88632524238004e-13, 3.28339498763286e-16), `FDR correction (sd)` = c(2.00046170407461e-14, 
        2.32019633515427e-12, 1.10782095003689e-15), `P-value (mean)` = c(5.55365134900322e-15, 
        6.44757191496266e-13, 3.07475941705412e-16), `P-value (sd)` = c(1.98732517127302e-14, 
        2.30494707691577e-12, 1.10054774779699e-15)), class = c("tbl_df", 
        "tbl", "data.frame"), .Names = c("Sample name", "FDR correction (mean)", 
        "FDR correction (sd)", "P-value (mean)", "P-value (sd)"), row.names = c(NA,  -3L))
  },
  extensions = "Responsive"
  )
```

Upvotes: 2

parth
parth

Reputation: 1631

Using width = 12 in mainPanel and enclosing table inside div did the trick.

---
title: "FOO"
runtime: shiny
output: 
  flexdashboard::flex_dashboard:
    vertical_layout: scroll
    orientation: columns
    theme:   default

---

```{r setup, include=FALSE}
library(flexdashboard)
library(tidyverse)
```

Columns
-------------------------------------

### Statistical Test Summary
```{r stat_test_table}

mainPanel(width = 12,
  div(style="height:570px",
  renderTable( {
      dat <- df <- structure(list(`Sample name` = structure(1:3, .Label = c("Sample1", 
          "Sample2", "Sample3"), class = "factor"), `FDR correction (mean)` = c(5.93070861978308e-15, 
         6.88632524238004e-13, 3.28339498763286e-16), `FDR correction (sd)` = c(2.00046170407461e-14, 
        2.32019633515427e-12, 1.10782095003689e-15), `P-value (mean)` = c(5.55365134900322e-15, 
        6.44757191496266e-13, 3.07475941705412e-16), `P-value (sd)` = c(1.98732517127302e-14, 
        2.30494707691577e-12, 1.10054774779699e-15)), class = c("tbl_df", 
        "tbl", "data.frame"), .Names = c("Sample name", "FDR correction (mean)", 
        "FDR correction (sd)", "P-value (mean)", "P-value (sd)"), row.names = c(NA,  -3L))
  }
  , digits=-2, width = '100%'
  ))
)
```

It produces the output as : snapshot

Upvotes: 3

Tonio Liebrand
Tonio Liebrand

Reputation: 17689

Interesting. If you look at the docu of ?mainPanel(). You will see that the width is by default restricted to "8" (12 is the max): mainPanel(..., width = 8)

So if you simplfy change to: mainPanel(..., width = 12) it will work.

Upvotes: 6

Related Questions