plotlyOutput shows previous plot before refresh in Shiny Apps - shiny

Question

I have created a small Shiny Application using Plotly heatmap and intend to use withSpinner to plot Heat Map depending on user input. Currently i have two issues.
a.) WithSpinner appears only for the first time when heat map is generated. It doesn't appear if the User input is changed and replotting is done.
b.) On change of User input, the previous heatmap is shown instead of spinner and it refreshes after sometime. I intend to use spinner instead of showing old plot during redrawing of heatmap.
library(shiny)
library(shinydashboard)
library(shinycssloaders)
library(shinyjs)
library(plotly)
ui <- shinydashboard::dashboardPage(
# Dashboard header
shinydashboard::dashboardHeader(),
# Dashboard sidebar
shinydashboard::dashboardSidebar(disable = TRUE),
# Dashboard body
shinydashboard::dashboardBody(
id = "myBody",
# Tab items
shinydashboard::tabItem(tabName = "visual",
fluidRow(
shinydashboard::tabBox(id="tabBix1",
shiny::tabPanel(
"Parameters & Settings",
value = "paramsetting",
sliderInput("obs", "Number of observations:",
min = 0, max = 1000, value = 500
)),
shiny::tabPanel(
"PlotOutput",
value = "Ops",
withSpinner(plotly::plotlyOutput("plotNewExp"))
)
)
))
)
)
server <- function(input, output, session) {
p <- NULL
observeEvent(input$obs,{
p <- NULL
m <- matrix(rnorm(input$obs), nrow = 3, ncol = 3)
output$plotNewExp <- plotly::renderPlotly({
p <- plot_ly(
x = c("a", "b", "c"), y = c("d", "e", "f"),
z = m, type = "heatmap"
)
})
})
}
shinyApp(ui=ui,server=server)

Answer 1

If you try this you will see that the spinner is working but it is fast. So you probably don't have the time to see it when you switch from one tab to the other.
ui <- shinydashboard::dashboardPage(
# Dashboard header
shinydashboard::dashboardHeader(),
# Dashboard sidebar
shinydashboard::dashboardSidebar(disable = TRUE),
# Dashboard body
shinydashboard::dashboardBody(
id = "myBody",
# Tab items
shinydashboard::tabItem(tabName = "visual",
fluidRow(
shinydashboard::tabBox(
tabPanel(
"Parameters & Settings",
value = "paramsetting",
sliderInput("obs", "Number of observations:",
min = 0, max = 1000, value = 500
),
withSpinner(plotly::plotlyOutput("plotNewExp")))
# tabPanel(
# "PlotOutput",
# withSpinner(plotly::plotlyOutput("plotNewExp"))
# )
)
))
)
)
server <- function(input, output, session) {
# p <- NULL
# observeEvent(input$obs,{
# p <- NULL
m <- reactive({matrix(rnorm(input$obs), nrow = 3, ncol = 3)})
output$plotNewExp <- renderPlotly({
p <- plot_ly(
x = c("a", "b", "c"), y = c("d", "e", "f"),
z = m(), type = "heatmap"
)
# })
})
}
shinyApp(ui=ui,server=server)
or if you add a delay, you will see it is working.
library(shinyjs)
ui <- shinydashboard::dashboardPage(
# Dashboard header
shinydashboard::dashboardHeader(),
# Dashboard sidebar
shinydashboard::dashboardSidebar(disable = TRUE),
# Dashboard body
shinydashboard::dashboardBody(
useShinyjs(),
id = "myBody",
# Tab items
shinydashboard::tabItem(tabName = "visual",
fluidRow(
shinydashboard::tabBox(id="tabBix1",
shiny::tabPanel(
"Parameters & Settings",
value = "paramsetting",
sliderInput("obs", "Number of observations:",
min = 0, max = 1000, value = 500
)),
shiny::tabPanel(
"PlotOutput",
value = "Ops",
withSpinner(plotly::plotlyOutput("plotNewExp"))
)
)
))
)
)
server <- function(input, output, session) {
# p <- NULL
Graph <- function() {
p <- NULL
m <- matrix(rnorm(input$obs), nrow = 3, ncol = 3)
output$plotNewExp <- plotly::renderPlotly({
p <- plot_ly(
x = c("a", "b", "c"), y = c("d", "e", "f"),
z = m, type = "heatmap"
)
})
}
observeEvent(input$obs,{
delay(4000, Graph())
})
}
shinyApp(ui=ui,server=server)