如何改善我的 Shiny-App 的滞后效应

Question

我有以下Shiny-App

library(shiny)
library(shinyjs)

ui <- fluidPage(
    useShinyjs(),  # Set up shinyjs
    column(3,
           div(id = "01", style = "cursor:pointer; height: 300px; width: 300px; text-align: center; background-color: green", HTML("01")),
           div(id = "02", style = "cursor:pointer; height: 300px; width: 300px; text-align: center; background-color: blue", HTML("02")),
           div(id = "03", style = "cursor:pointer; height: 300px; width: 300px; text-align: center; background-color: red", HTML("03")),
    )

)



server = function(input, output,session) { 
    Plot_I = reactiveValues()
        Get_1 =
          function(Plot_I) {
                Plot_I$x = "Plot_Get_1"
            }
        Get_2 =
          function(Plot_I) {
                Plot_I$x = "Plot_Get_2"
            }
        Get_3 =
          function(Plot_I) {
                Plot_I$x = "Plot_Get_3"
            }

      observe({
      onclick('01', 
            {Get_1(Plot_I)
            showModal(modalDialog(size = 'l', footer = NULL, easyClose = TRUE,
                            column(9, htmlOutput("Indiv_Plot_All_Title"))
                        )
                )

            }
            )
          })

      observe({
      onclick('02', 
            {Get_2(Plot_I)
            showModal(modalDialog(size = 'l', footer = NULL, easyClose = TRUE,
                            column(9, htmlOutput("Indiv_Plot_All_Title"))
                        )
                )

            }
            )
          })

      observe({
      onclick('03', 
            {Get_3(Plot_I)
            showModal(modalDialog(size = 'l', footer = NULL, easyClose = TRUE,
                            column(9, htmlOutput("Indiv_Plot_All_Title"))
                        )
                )

            }
            )
          })


        output$Indiv_Plot_All_Title = 
        renderText({
          req(Plot_I$x)

          if (Plot_I$x == "Plot_Get_1") {
              "Plot 1"
            } else if (Plot_I$x == "Plot_Get_2") {
              "Plot 2"
            } else {
              "Plot 3"
            }
        })

}

shinyApp(ui, server)

目标是当用户单击特定 Div 时，modal-dialog 框中将显示不同的值。

然而，虽然这是按预期工作的，但在这种方法中，我仍然看到某种滞后效应。例如，当用户首先单击 div 然后单击第二个 div 时，我看到第一个 div 的值在 modal-dialog 中仍然可见一段时间。

有什么方法可以消除这种滞后吗？

任何指点将不胜感激。

Answer 1

将以下内容添加到您的服务器代码中：

outputOptions(output, "Indiv_Plot_All_Title", suspendWhenHidden = FALSE)

您的代码将变为：

library(shiny)
library(shinyjs)

ui <- fluidPage(
  useShinyjs(),  # Set up shinyjs
  column(3,
         div(id = "01", style = "cursor:pointer; height: 300px; width: 300px; text-align: center; background-color: green", HTML("01")),
         div(id = "02", style = "cursor:pointer; height: 300px; width: 300px; text-align: center; background-color: blue", HTML("02")),
         div(id = "03", style = "cursor:pointer; height: 300px; width: 300px; text-align: center; background-color: red", HTML("03")),
  )

)



server = function(input, output,session) { 
  Plot_I = reactiveValues()
  Get_1 =
    function(Plot_I) {
      Plot_I$x = "Plot_Get_1"
    }
  Get_2 =
    function(Plot_I) {
      Plot_I$x = "Plot_Get_2"
    }
  Get_3 =
    function(Plot_I) {
      Plot_I$x = "Plot_Get_3"
    }

  observe({
    onclick('01', 
            {Get_1(Plot_I)
              showModal(modalDialog(size = 'l', footer = NULL, easyClose = TRUE,
                                    column(9, htmlOutput("Indiv_Plot_All_Title"))
              )
              )

            }
    )
  })

  observe({
    onclick('02', 
            {Get_2(Plot_I)
              showModal(modalDialog(size = 'l', footer = NULL, easyClose = TRUE,
                                    column(9, htmlOutput("Indiv_Plot_All_Title"))
              )
              )

            }
    )
  })

  observe({
    onclick('03', 
            {Get_3(Plot_I)
              showModal(modalDialog(size = 'l', footer = NULL, easyClose = TRUE,
                                    column(9, htmlOutput("Indiv_Plot_All_Title"))
              )
              )

            }
    )
  })


  output$Indiv_Plot_All_Title = 
    renderText({
      req(Plot_I$x)

      if (Plot_I$x == "Plot_Get_1") {
        "Plot 1"
      } else if (Plot_I$x == "Plot_Get_2") {
        "Plot 2"
      } else {
        "Plot 3"
      }
    })

  outputOptions(output, "Indiv_Plot_All_Title", suspendWhenHidden = FALSE)

}

shinyApp(ui, server)

滞后是由于 modalDialog() 的内容仅在 打开后 才更新。通过将 outputOptions() 中的 suspendWhenHidden 设置为 FALSE，即使 modalDialog()尚未调用和打开。

如何改善我的 Shiny-App 的滞后效应

How to improve the lag-effect of my Shiny-App

shiny

shinyapps