Shiny Dashboard - Display a Dedicated "Loading.." Page Until Initial Loading of the Data Is Done

Loading Page for Shiny Dashboard

Try this library shinycssloaders

library(shiny)
library(shinycssloaders)
library(highcharter)

ui <- fluidPage(
mainPanel(
plotOutput("my_plot") %>% withSpinner(color="#0dc5c1")
)
)

server <- function(input, output){

output$my_plot <- renderPlot({
Sys.sleep(1)
plot(mtcars)})
}

shinyApp(ui, server)

Sample Image

Loading Page in R shiny for a fixed amount of time

It appears that you are using code from https://stackoverflow.com/a/35665217/3358272, which makes this a dupe of sorts, but perhaps not in the vein of: how to do that with more UI components.

Just wrap all of your title and sidepanel stuff in hidden(div(...)) with an id.

From there, you can allow other things to do some work by using a reactive observe block that fires twice: the first time it sets a wake-up alarm (3000 milliseconds here), the second time it removes the #loading_page div.

ui <- fluidPage(
useShinyjs(),
div(
id = "loading_page",
h1("Loading...")
),
hidden(
div(
id = "main_content",
titlePanel("XYZ"),
sidebarLayout(
sidebarPanel(
p("Lorem Ipsum"),
selectInput(inputId = "ab", label = "SelectSomething", choices = c("A","B","C","D")),
p("Please Wait for 30 secs for data to load.."),
sliderInput(inputId = "Age", label = "Age Range", min=16, max=45, value=c(16,45)),
actionButton(inputId = "update", label = "Go!"),
),
mainPanel(
h3("ABC:"),
uiOutput("table"),
br(),
uiOutput("OP1"),
br(),
uiOutput("OP2"),
uiOutput("OP3"),
br(),
uiOutput("OP4")
)
)
)
)
)
server <- function(input, output, session) {
already_started <- FALSE
observe({
if (already_started) {
removeUI("#loading_page")
} else {
invalidateLater(3000, session)
already_started <<- TRUE
}
})
}

It would also be "right" to use a reactiveVal for already_started. The reason I didn't was that we don't need reactivity from it, just a two-shot memory.

Shiny and R: load data only once - do not load at each start of app and have progress bar

For the progress bar, you can use the shinyjs package to hide/show components. See for example this link Shiny Dashboard - display a dedicated "loading.." page until initial loading of the data is done

R shiny: display loading... message while function is running

I'm already using a simpler and more reliable way than the one I posted before.

A combination of

tags$style(type="text/css", "
#loadmessage {
position: fixed;
top: 0px;
left: 0px;
width: 100%;
padding: 5px 0px 5px 0px;
text-align: center;
font-weight: bold;
font-size: 100%;
color: #000000;
background-color: #CCFF66;
z-index: 105;
}
")

with

conditionalPanel(condition="$('html').hasClass('shiny-busy')",
tags$div("Loading...",id="loadmessage")
)

Example:

runApp(list(
ui = pageWithSidebar(
headerPanel("Test"),
sidebarPanel(
tags$head(tags$style(type="text/css", "
#loadmessage {
position: fixed;
top: 0px;
left: 0px;
width: 100%;
padding: 5px 0px 5px 0px;
text-align: center;
font-weight: bold;
font-size: 100%;
color: #000000;
background-color: #CCFF66;
z-index: 105;
}
")),
numericInput('n', 'Number of obs', 100),
conditionalPanel(condition="$('html').hasClass('shiny-busy')",
tags$div("Loading...",id="loadmessage"))
),
mainPanel(plotOutput('plot'))
),
server = function(input, output) {
output$plot <- renderPlot({ Sys.sleep(2); hist(runif(input$n)) })
}
))

tags$head() is not required, but it's a good practice to keep all the styles inside head tag.

R Shiny - Optimize page loading time with updateSelectizeInput

Finally I found the solution from the post on RStudio.
http://shiny.rstudio.com/articles/selectize.html

# in ui.R
selectizeInput('foo', choices = NULL, ...)

# in server.R
shinyServer(function(input, output, session) {
updateSelectizeInput(session, 'foo', choices = data, server = TRUE)
})

When we type in the input box, selectize will start searching for the options that partially match the string we typed. The searching can be done on the client side (default behavior), when all the possible options have been written on the HTML page. It can also be done on the server side, using R to match the string and return results. This is particularly useful when the number of choices is very large. For example, when there are 100,000 choices for the selectize input, it will be slow to write all of them at once into the page, but we can start from an empty selectize input, and only fetch the choices that we may need, which can be much faster. We will introduce both types of the selectize input below.

How to display blank dashboard in Siny Dashboardbody until user selects options from drop down in R?

It seems like a conditionalPanel() is the answer here. A conditional panel simply shows its contents based on a condition, which could be based on your input location.

If you edit your outputs to look like this:

conditionalPanel(
#Uses a Javascript formatted condition
condition="input.slct1 !== ' '",
box( DT::dataTableOutput("mytable")),
box(plotlyOutput('out'))
)

and also edit the resetForm() function to

updateSelectInput(session,"slct1",selected = ' ')

You should receive your desired result.



Related Topics



Leave a reply



Submit