Why are my DT Tables not generating tabBox/tabPanel? - r

This is a problem I can't seem to solve and I'm not sure why its happening.
My goal is to use the tabBox to put various tables in a single "flexdashboard area" and using {.tabset} is not an option. But it seems that when I start using tabPanels - only the first panel will generate my DT table and the second will not. The headers of the table are generating but I can't figure our why the actual data will not.
I'll be grateful for any help.
Here is what I see:
Tab 1
Tab2
Here is my code
---
title: "Example Demo Dash"
output:
flexdashboard::flex_dashboard:
orientation: columns
vertical_layout: fill
runtime: shiny
---
# Tab 1
```{r setup, include=FALSE}
library(readr)
library(DT)
library(dplyr)
library(rsconnect)
require(flexdashboard)
library(shiny)
library(shinydashboard)
require(plotly)
```
Column
-----------------------------------------------------------------------
### Tab 1 Graph
# Tab 2
Column {data-width=450}
-----------------------------------------------------------------------
### Cars Tab 1
```{r}
cars <- datatable(mtcars,
rownames = FALSE,
options = list(
dom = 't',
paging = FALSE,
info = FALSE,
scrollY = FALSE,
sort = FALSE
)
)
iris <- datatable(mtcars,
rownames = FALSE,
options = list(
dom = 't',
paging = FALSE,
info = FALSE,
scrollY = FALSE,
sort = FALSE
)
)
```
```{r}
tabBox(width=18, height = "500px" ,
#Dec 2020
tabPanel("Cars 1", cars),
#Jan 2021
tabPanel("Iris", iris))
```
### Col 2 Row 2
Column {data-width=200}
-----------------------------------------------------------------------
### Tab 2 Col 2 Graph 1
### Tab 2 Col 2 Graph 1
### Tab 2 Col 2 Graph 3
### Tab 2 Col 2 Graph 3
Column {data-width=350}
-----------------------------------------------------------------------
### Col 3 graph 1
### Col 3 graph 2
# tab 3

Related

updatePickerInput() - stop users from selecting more than one item when clicking on a new tab

I am trying to update a picker input in a flexdashboard but can't seem to correctly do it.
When a user clicks on the "ThisTabGetsClicked" tab, I want the sidebar to update and just allow the user to select one item from the drop down menu. When the user exits this tab (by clicking on another tab) I want them to have the options back again.
How can I "disable" the option for users to select more than one item in the dropdown?
Flexdashboard:
---
title: "Untitled"
output:
flexdashboard::flex_dashboard:
orientation: columns
vertical_layout: fill
---
```{r setup, include=FALSE}
library(flexdashboard)
library(shiny)
library(shinyWidgets)
library(shinyjs)
library(tidyverse)
```
MySidebar {.sidebar data-width=300}
==============================
```{r}
useShinyjs(rmd = TRUE)
items = c("I1", "I2", "I3", "I4", "I5")
shinyWidgets::pickerInput(
inputId = "select",
choices = items,
selected = items[1],
multiple = TRUE,
options = list(
`actions-box`= TRUE,
size = 10,
`selected-text-format` = "count > 3"
)
)
```
# Home {data-orientation=rows}
=====================================
### Box1
1
c2
### Box2.1
2.1
### Box2.2
2.2
# ThisTabGetsClicked {data-orientation=rows}
=====================================
Here, I want to update the side bar dropdown to only display one input
```{r}
only_one_item_allowed = reactive({
input$select[1]
})
```
```{r}
observeEvent(input$apply, {
updatePickerInput(inputId = "select",
choices = only_one_provincia_allowed(),
selected = only_one_provincia_allowed(),
options = list(
size = 10
)
)
})
```

Layout of flexdashboard - having multiple tabsets

I currently have my dashboard which looks like:
What I am trying to do is under the Data tab have additional tabs. For example I want to combine the Table Population tab with the Graphic iris tab so that the table and graphic are on the same page. Then in a new tab have the Another tab-pag (as it currently is).
How can I merge the two tabs to have them on the same page?
I would like this joined tab to look like the Analysis tab:
Dashboard:
---
title: "Analysis"
output:
flexdashboard::flex_dashboard:
#css: "custom_style.css"
theme:
base_font:
google: Prompt
code_font:
google: JetBrains Mono
orientation: columns
vertical_layout: fill
runtime: shiny
---
```{r setup, include=FALSE}
library(flexdashboard)
library(shiny)
library(shinyWidgets)
library(shinyjs)
library(gt)
library(gtExtras)
library(plotly)
```
MySidebar {.sidebar}
==============================
```{r}
useShinyjs(rmd = TRUE)
shinyWidgets::pickerInput(
inputId = "select_species",
label = h4("Species"),
choices = unique(iris$Species),
selected = unique(iris$Species[1]),
multiple = TRUE,
options = list(
`actions-box`= TRUE,
size = 10,
`selected-text-format` = "count > 1"
)
)
```
Introduction {data-vertical_layout=scroll}
==============================
Column {data-width=650 .main .tabset}
-----------------------------------------------------------------------
Here is some introduction text
Data {data-vertical_layout=scroll}
==============================
IRIS Species {.tabset .tabset-fade}
-------------------------------------
### Table Population
```{r}
output$irisTable = render_gt({
iris %>%
gt() %>%
gt_add_divider(columns = "Provincias", weight = px(3), color = "lightgrey", include_labels = FALSE)
})
div(style='height:800px; overflow-y: scroll',
gt_output("populationTable")
)
```
### Graphic iris
```{r}
renderPlotly({
ggplotly(
iris %>%
ggplot(aes(x = Species, y = Petal.Length)) +
geom_bar() +
theme_bw()
)
})
```
### Another tab-page
Analysis {data-vertical_layout=scroll}
==============================
Column
-------------------------------------
### Tab 1
some text
### Tab 2
some more text

Flexdashboard columns - text not showing up

In my flexdashboard I have a column with a note, then a table, and I would like to add one more note below the table. But I am struggling to get the second note to show up. I can make a new header there but I really just want another sentence that shows up without a new header. Here is some simple code to illustrate. Thanks!
---
title: "Untitled"
output:
flexdashboard::flex_dashboard:
orientation: columns
vertical_layout: scroll
runtime: shiny
---
```{r setup, include=FALSE}
library(flexdashboard)
library(dplyr)
library(shiny)
library(rhandsontable)
df <- tibble(
`Col 1` = seq(1,24,1), `Col 2` = " ")
```
Column {data-width=650}
-----------------------------------------------------------------------
### Table
I can write a note here
```{r}
output$table_exer <- renderRHandsontable({
rhandsontable(df, rowHeaders = NULL)
})
rHandsontableOutput("table_exer")
```
But I also want a note here
Column {data-width=350}
-----------------------------------------------------------------------
### Chart B
```{r}
```
### Chart C
```{r}
```
very simple, wrap your table inside fluidRow, like this:
```{r}
output$table_exer <- renderRHandsontable({
rhandsontable(df, rowHeaders = NULL)
})
fluidRow(rHandsontableOutput("table_exer"))
```
To make the margin and spacing look nicer, we can also do following:
```{r}
output$table_exer <- renderRHandsontable({
rhandsontable(df, rowHeaders = NULL)
})
column(12, fluidRow(rHandsontableOutput("table_exer")))
br()
```

How to add tab sets into flexdashboard?

I am working with flexdashboard and I am trying to add sub tabset into tabset . Below you can see my code:
---
title: "Test APPLICATION"
output:
flexdashboard::flex_dashboard:
orientation: columns
vertical_layout: fill
---
```{r setup, include=FALSE}
library(flexdashboard)
library(data.table)
library(tidyr)
library(dplyr)
library(tidyverse)
library(knitr)
library(DT)
library(rpivotTable)
library(biclust)
data(BicatYeast)
data=data.frame(data(BicatYeast))
```
# Intro
Testing application
Tabset 1
=======================================================================
Row {.tabset}
-----------------------------------------------------------------------
### Notes
### Sub tabset 1
```{r,eval=TRUE}
rpivotTable(
data,
aggregatorName = "Integer Sum",
vals="Total",
cols = "Test",
width="100%",
height="400px",
rendererName = "Table"
)
```
### Sub tabset 2
```{r,eval=TRUE}
rpivotTable(
data,
aggregatorName = "Integer Sum",
vals="Total",
cols = "Test",
width="100%",
height="400px",
rendererName = "Table"
)
```
Tabset 2
=======================================================================
Row {.tabset}
-----------------------------------------------------------------------
### Sub tabset 1
```{r,eval=TRUE}
datatable(data,
caption = "Test",
rownames = T,
filter = "top",
class = 'cell-border stripe',
extensions='Buttons',
options = list(
pageLength = 50,
dom = 'Blfrtip',
buttons=c('copy','csv','excel','pdf','print'),
lengthMenu = list(c(10,25,50,-1),c(10,25,50,"All"))
))
```
### Sub tabset 2
```{r,eval=TRUE}
datatable(data,
caption = "Test",
rownames = T,
filter = "top",
class = 'cell-border stripe',
extensions='Buttons',
options = list(
pageLength = 50,
dom = 'Blfrtip',
buttons=c('copy','csv','excel','pdf','print'),
lengthMenu = list(c(10,25,50,-1),c(10,25,50,"All"))
))
```
Now, I want to put additional tab sets under Sub tabset 1. Can anybody help me on how to solve this problem and add additional tab sets (two or three)?

Input menu contents do not overflow row box in flexdashboard

I am creating a reactive dashboard using flexdashboard with shiny. I would like the first row below the header to contain two separate selectInput() menus. I am keeping the height of the rows small (50), because there will be several more graphs underneath and I need the space. However, when the dashboard is rendered, clicking on the input menu to select another option results in the dropdown "disappearing" behind the row (not overflowing it). This makes it difficult to select items below the second or third element. How do I make the contents overflow? Here is a reproducible code + screenshot:
---
title: "Test Dashboard"
output:
flexdashboard::flex_dashboard:
orientation: rows
vertical_layout: fill
runtime: shiny
---
```{r setup, include=FALSE}
library(flexdashboard)
library(shiny)
```
Row {data-height=50}
-----------------------------------------------------------------------
### Window 1
```{r}
selectInput("project", label = NULL, choices = c("A","B","C","D"))
```
### Window 2
```{r}
selectInput("data", label = NULL, choices = c("1","2","3","4","5", "6"))
```
Row
-----------------------------------------------------------------------
### Chart B
```{r}
renderPlot({
plot(rnorm(1000), type = "l", main = paste("Project:",input$project, " Data:", input$data))
})
```
Attached an image of how it looks.
Flexdasboard image:
Thanks much,
Jorge
You said there will be more graphs in the future, but I think you can render the individual plots 'underneath' Flexdashboard, to save space. I changed, the rows to columns, let me know.
---
title: "Test Dashboard"
output:
flexdashboard::flex_dashboard:
orientation: rows
vertical_layout: fill
runtime: shiny
---
```{r setup, include=FALSE}
library(flexdashboard)
library(shiny)
```
Column {data-width=600}
-----------------------------------------------------------------------
### Window 1
```{r}
selectInput("project", label = NULL, choices = c("A","B","C","D"))
```
### Window 2
```{r}
selectInput("data", label = NULL, choices = c("1","2","3","4","5", "6"))
```
Column {data-width=400}
-----------------------------------------------------------------------
### Chart B
```{r}
renderPlot({
plot(rnorm(1000), type = "l", main = paste("Project:",input$project, " Data:", input$data))
})
```

Resources