【问题标题】:Blinking Loading Text in R Shiny在 R Shiny 中闪烁加载文本
【发布时间】:2016-09-25 00:16:00
【问题描述】:

我在闪亮的 ui 部分中添加什么会使我的#loadmessage 闪烁?我见过这样的事情

How to make blinking/flashing text with css3?

但是,我不确定如何在 R 中实现这一点。

我的 ui 代码中有以下加载功能:

tags$head(tags$style(type="text/css", 
                      "#loadmessage {
                       position: fixed;
                       top: 50%;
                       left: 50%;
                       ocacity: 0.50; 
                       opacity: 0.0;
                       text-align: center;
                       font-weight: bold;
                       font-size: 300%;
                       color: #000000;
                       z-index: 105;
                       }"))


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

【问题讨论】:

    标签: css r shiny loading


    【解决方案1】:

    大概是这样?

    library(shiny)
    
    ui <- shinyUI(
      fluidPage(
        tags$head(tags$style(type="text/css", 
          "#loadmessage {
            position: fixed;
            top: 50%;
            left: 50%;
            ocacity: 0.50; 
            text-align: center;
            font-weight: bold;
            font-size: 300%;
            color: #000000;
            z-index: 105;
            animation: blinker 1s linear infinite;
          }")),
    
        conditionalPanel(condition="$('html').hasClass('shiny-busy')",
          tags$div("Loading...",id="loadmessage"),
          tags$script(HTML("
            (function blink() { 
              $('#loadmessage').fadeOut(500).fadeIn(500, blink); 
            })();
          "))
        ),
        actionButton("action", "action")
      )
    )
    
    server <- function(input, output){
      observeEvent(input$action, {
        Sys.sleep(3)
      })
    }
    
    shinyApp(ui, server)
    

    【讨论】:

    • 你是最棒的。谢谢!
    猜你喜欢
    • 2019-12-08
    • 2014-05-02
    • 2018-10-24
    • 2017-03-08
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多