Flexdashboard doesn't work with Shiny URL state - r

I am trying to combine flexdashboard with Shiny state bookmarking. When used alone (example from the docs) Shiny app works fine, but when put in flexdasboard, url is not updated:
---
title: "Untitled"
output:
flexdashboard::flex_dashboard:
orientation: columns
vertical_layout: fill
runtime: shiny
---
```{r setup, include=FALSE}
library(flexdashboard)
```
Column {data-width=650}
-----------------------------------------------------------------------
### Chart A
```{r}
shinyApp(
ui=function(req) {
fluidPage(
textInput("txt", "Text"),
checkboxInput("chk", "Checkbox")
)
},
server=function(input, output, session) {
observe({
# Trigger this observer every time an input changes
reactiveValuesToList(input)
session$doBookmark()
})
onBookmarked(function(url) {
updateQueryString(url)
})
},
enableBookmarking = "url"
)
```
Is this even possible? Compared to standalone execution:
shinyApp(
ui=function(req) {
fluidPage(
textInput("txt", "Text"),
checkboxInput("chk", "Checkbox")
)
},
server=function(input, output, session) {
observe({
# Trigger this observer every time an input changes
reactiveValuesToList(input)
session$doBookmark()
})
onBookmarked(function(url) {
updateQueryString(url)
})
},
enableBookmarking = "url"
)
it looks like onBookmarked (and similar events like onBookmark, onRestore and onRestored) are never triggered.

Bookmarking isn't supported in Shiny apps embedded in R Markdown documents.
See discussion here: https://github.com/rstudio/shiny/pull/1209#issuecomment-227207713
Sounds like it's technically possible, but tricky to do. For example, what happens if there are multiple apps embedded in the document? Also, apps are embedded as iframes, so there would have to be some wiring up to be done to allow these apps to access/modify their parent window's URL.
However, bookmarking does work with embedded Shiny components (rather than full applications).
---
title: "Untitled"
output:
flexdashboard::flex_dashboard:
orientation: columns
vertical_layout: fill
runtime: shiny
---
```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = FALSE)
enableBookmarking("url")
```
```{r, include=FALSE}
observe({
reactiveValuesToList(input)
session$doBookmark()
})
onBookmarked(function(url) {
updateQueryString(url)
})
output$content <- renderUI({
tagList(
textInput("txt", "Text"),
checkboxInput("chk", "Checkbox")
)
})
```
Column {data-width=650}
-----------------------------------------------------------------------
### Chart A
```{r}
fluidPage(
uiOutput("content"),
selectInput("sel", label = "Select", choices = c(10, 20, 30), selected = 10)
)
```
You can also use Prerendered Shiny Documents, although bookmarking would not work 100% the same since the UI is pre-rendered. Any static UI would have to be manually restored with bookmarking callbacks, but dynamic UI would be restored just fine.
---
title: "Untitled"
output:
flexdashboard::flex_dashboard:
orientation: columns
vertical_layout: fill
runtime: shiny_prerendered
---
```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = FALSE)
enableBookmarking("url")
```
```{r, context="server"}
observe({
reactiveValuesToList(input)
session$doBookmark()
})
onBookmarked(function(url) {
updateQueryString(url)
})
# Static inputs are pre-rendered, and must be manually restored
onRestored(function(state) {
updateSelectInput(session, "sel", selected = state$input$sel)
})
# Dynamic inputs will be restored with no extra effort
output$content <- renderUI({
tagList(
textInput("txt", "Text"),
checkboxInput("chk", "Checkbox")
)
})
```
Column {data-width=650}
-----------------------------------------------------------------------
### Chart A
```{r}
fluidPage(
uiOutput("content"),
selectInput("sel", label = "Select", choices = c(10, 20, 30), selected = 10)
)
```

Related

Flexdashboard into Shiny

I am trying to adapt the RMarkdown file with *.rmd extension into Shiny application. My file has elements of Shiny but works with flexdashboard. Below you can see the code.
---
title: "Test"
author: " "
output:
flexdashboard::flex_dashboard:
orientation: columns
social: menu
source_code: embed
runtime: shiny
editor_options:
markdown:
wrap: 72
---
# Module 1
```{r global, include=FALSE}
library(biclust)
data(BicatYeast)
set.seed(1)
res <- biclust(BicatYeast, method=BCPlaid(), verbose=FALSE)
```
## Inputs {.sidebar}
```{r}
selectInput("clusterNum", label = h3("Cluster number"),
choices = list("1" = 1, "2" = 2),
selected = 1)
```
## Row {.tabset}
### Parallel Coordinates
```{r}
num <- reactive(as.integer(input$clusterNum))
renderPlot(
parallelCoordinates(BicatYeast, res, number=num()))
```
### Data for Selected Cluster
```{r}
renderTable(
BicatYeast[which(res#RowxNumber[, num()]), which(res#NumberxCol[num(), ])]
)
```
The shiny app usually has two main parts first is ui and second is server, so can anybody help how to solve this problem and run this file as a Shiny app.
library(shiny)
library(biclust)
ui <- fluidPage(
selectInput("clusterNum",
label = h3("Cluster number"),
choices = list("1" = 1, "2" = 2),
selected = 1
),
plotOutput("plot"),
tableOutput("table")
)
server <- function(input, output, session) {
set.seed(1)
data(BicatYeast)
res <- biclust(BicatYeast, method = BCPlaid(), verbose = FALSE)
num <- reactive(as.integer(input$clusterNum))
output$plot <-
renderPlot(
parallelCoordinates(BicatYeast, res, number = num())
)
output$table <-
renderTable(
BicatYeast[which(res#RowxNumber[, num()]), which(res#NumberxCol[num(), ])]
)
}
shinyApp(ui, server)

Embed a website in shiny app using flexdashboard: not working, not reactive

I am trying to make a shinyapp using flexdashboard. The app takes as input a string of text, and then it outputs a website using that input text. I have an example of the app working in standard shiny. My problem is "translating" it to an app using flexdashboard.
Here is my app in standard shiny:
library(shiny)
ui <- fluidPage(titlePanel("Testing"),
sidebarLayout(
sidebarPanel(
fluidRow(
column(9, selectInput("Color", label=h5("Choose a color"),choices=c('red', 'blue'))
))),
mainPanel(fluidRow(
htmlOutput("frame")
)
)
))
server <- function(input, output) {
observe({
query <- input$Color
test <<- paste0("https://en.wikipedia.org/wiki/",query)
})
output$frame <- renderUI({
input$Color
my_test <- tags$iframe(src=test, height=600, width=535, frameborder = "no")
print(my_test)
my_test
})
}
shinyApp(ui, server)
Here is my attempt trying to get it to work using flexdashboards. I am having problem trying to get the input as a reactive expression to make my output dynamic. I am trying 2 different ways to get the output, but none work.
---
title: "Testing Colors"
output:
flexdashboard::flex_dashboard:
orientation: columns
vertical_layout: fill
runtime: shiny
---
```{r setup, include=FALSE}
library(flexdashboard)
library(knitr)
lookup <- structure(c("r", "b"), .Names = c("Red", "Blue"))
Column {.sidebar}
-----------------------------------------------------------------------
```{r}
selectInput('Color', label = 'Select a color', choices = lookup, selected = "r")
Column {data-width=600}
-----------------------------------------------------------------------
### Color Web Page
```{r}
observeEvent(input$Color,{
output$url <-renderUI(a(href=paste0("https://en.wikipedia.org/wiki/", input$Color)))
})
Column {data-width=400}
-----------------------------------------------------------------------
### Another webpage
```{r}
selectedColor<- reactive({
color <- input$Color
})
webpage <- renderUI({
include_url(paste0("https://www.wikipedia.org/",selectedColor))
})
webpage
I would certainly appreciate any comments or ideas.
Thanks!
This code gave me a flexdashboard back with the selectInput, I think the alignment of spaces made for errors
---
title: "Testing Colors"
output:
flexdashboard::flex_dashboard:
orientation: columns
vertical_layout: fill
runtime: shiny
---
```{r setup, include=FALSE}
library(flexdashboard)
library(knitr)
lookup <- structure(c("r", "b"), .Names = c("Red", "Blue"))
```
```{r,}
selectInput('Color', label = 'Select a color', choices = lookup, selected = "r")
```
Column {data-width=600}
-----------------------------------------------------------------------
### Color Web Page
```{r}
observeEvent(input$Color,{
output$url <-renderUI(a(href=paste0("https://en.wikipedia.org/wiki/", input$Color)))
})
```
Column {data-width=400}
-----------------------------------------------------------------------
### Another webpage
```{r}
selectedColor<- reactive({
color <- input$Color
})
webpage <- renderUI({
include_url(paste0("https://www.wikipedia.org/",selectedColor))
})
webpage

Not able to Remove previously inserted UI

in the below app, I am not able to remove previously inserted UI. Not sure why. Could anyone please help...............................................................
---
title: "Untitled"
runtime: shiny
output:
flexdashboard::flex_dashboard:
orientation: columns
vertical_layout: fill
---
```{r setup, include=FALSE}
library(flexdashboard)
library(rhandsontable)
```r
Column {data-width=650}
-----------------------------------------------------------------------
### Insert and Remove UI
```{r}
actionButton("add", "Add UI")
actionButton("rmv", "Remove UI")
observeEvent(input$add, {
insertUI(
selector = "#add",
where = "afterEnd",
ui = textInput(paste0("txt", input$add),
"Insert some text"),multiple = FALSE
)
})
observeEvent(input$rmv, {
removeUI(
selector = "div:has(< #txt)"
)
})
```
```
We can get the previous ids using seq_len(input$add) where input$add is 1,2,3,... etc, then construct a jQuery statment using paste0 and sprintf
---
title: "Untitled"
runtime: shiny
output:
flexdashboard::flex_dashboard:
orientation: columns
vertical_layout: fill
---
```{r setup, include=FALSE}
library(flexdashboard)
library(rhandsontable)
```
Column {data-width=650}
-----------------------------------------------------------------------
```{r}
### Insert and Remove UI
actionButton("add", "Add UI")
actionButton("rmv", "Remove UI")
observeEvent(input$add, {
insertUI(
selector = "#add",
where = "afterEnd",
ui = textInput(paste0("txt", input$add),
sprintf("Insert some text for %i",input$add)),multiple = FALSE
)
})
observeEvent(input$rmv, {
removeUI(
#Remove the last UI
#selector = sprintf("div:has(> #txt%i)",input$add),
#Remove all previous UIs
selector = sprintf("div:has(%s)",paste0('> #txt', seq_len(input$add), collapse = ",")),
immediate = TRUE,
multiple = TRUE
)
})
```
Update
Remove the last UI every time user click Remove UI
### Insert and Remove UI
actionButton("add", "Add UI")
actionButton("rmv", "Remove UI")
data = reactiveValues(tmp=0)
observeEvent(input$add, {
data$tmp <- c(data$tmp,input$add)
insertUI(
selector = "#add",
where = "afterEnd",
ui = textInput(paste0("txt", input$add),
sprintf("Insert some text for %i",input$add)),multiple = FALSE
)
})
observeEvent(input$rmv, {
rm <- tail(data$tmp, 1)
data$tmp <- setdiff(data$tmp, rm)
removeUI(
#Remove the last UI
#selector = sprintf("div:has(> #txt%i)",input$add),
#Remove all previous UIs
selector = sprintf("div:has(%s)",paste0('> #txt', rm, collapse = ",")),
immediate = TRUE,
multiple = TRUE
)
})

Flex dashboard: Input and Outputs in different tabs

I´m a newby with flex-dashboards...
How can I separate in two different tabs the input information and output results? here is a simple example, I am trying to render only the barplot in the second tab "Output"
---
title: "Dashboard"
output:
flexdashboard::flex_dashboard:
runtime: shiny
---
```{r global, include=FALSE}
# load data in 'global' chunk so it can be shared by all users of the dashboard
library(datasets)
data(WorldPhones)
```
Inputs
=======================================================================
```{r, include=FALSE}
# Shiny module definition (would typically be defined in a separate R script)
# UI function
worldPhonesUI <- function(id) {
ns <- NS(id)
fillCol(height = 600, flex = c(2, 1),
inputPanel(
selectInput(ns("region"), "Region1:", choices = colnames(WorldPhones))
)
)
}
# Server function
worldPhones <- function(input, output, session) {
output$phonePlot <- renderPlot({
barplot(WorldPhones[,input$region]*1000,
ylab = "Number of Telephones", xlab = "Year")
})
}
```
```{r, eval=TRUE}
# Include the module
worldPhonesUI("phones")
callModule(worldPhones, "phones")
```
Results
=======================================================================
```{r}
worldPhonesUI <- function(id) {
ns <- NS(id)
fillCol(height = 600, flex = c(NA, 1),
plotOutput(ns("phonePlot"), height = "80%")
)
}
```
you forget everything about ui and server functions and put directly objects in chucks like this:
---
title: "Dashboard"
output:
flexdashboard::flex_dashboard:
runtime: shiny
---
```{r global, include=FALSE}
# load data in 'global' chunk so it can be shared by all users of the dashboard
library(datasets)
data(WorldPhones)
```
Inputs
=======================================================================
```{r}
selectInput("region", "Region1:", choices = colnames(WorldPhones))
```
Results
=======================================================================
```{r}
renderPlot({
barplot(WorldPhones[,input$region]*1000,
ylab = "Number of Telephones", xlab = "Year")
})
```

exact same shiny code can insert image in shiny but in shiny flexdashboard the image failed to show up

I run the exact same code in both shiny and shiny flexdashboard. The image can be inserted using shiny but failed for shiny flexdashboard. The image is stored in www folder and put in the same directory with the code file.
Does anyone know what the reason behind this would be?
shiny code:
setwd("C:/Users/Desktop/Shiny dashboard")
b=read.csv("table_clusterupdate.csv")
shinyApp(
ui = fluidPage(
img(src="cluster.png", height = 500, width = 900),
fluidPage(DT::dataTableOutput('tbl'))
),
server = function(input, output) {output$tbl = DT::renderDataTable(
b, options = list(lengthChange = FALSE)
)
})
Shiny flexdashboard code:
---
title: "R"
output:
flexdashboard::flex_dashboard:
orientation: columns
vertical_layout: fill
runtime: shiny
---
```{r setup, include=FALSE}
setwd("C:/Users/Desktop/Shiny dashboard")
b=read.csv("table_clusterupdate.csv")
```
Multidimensional OP cluster
===========================================
```{r}
shinyApp(
ui = fluidPage(
img(src="cluster.png", height = 500, width = 900),
fluidPage(DT::dataTableOutput('tbl'))
),
server = function(input, output) {output$tbl = DT::renderDataTable(
b, options = list(lengthChange = FALSE)
)
})
```

Resources