在过程中添加'计算'闪亮应用指标

时间:2014-03-31 22:10:51

标签: javascript css r shiny

我正在使用闪亮来构建一个Web应用程序。某些步骤需要一些时间来计算,因此我想在闪亮的应用程序中添加流程指示器中的计算。

我在stackoverflow中找到Show that Shiny is busy (or loading) when changing tab panels,但shinyIncubator包接缝需要指定min和max。

然后我找到了这个博客:http://withr.me/blog/2014/01/03/add-calculation-in-process-indictor-for-shiny-application/他提供了一个很好的方法来做到这一点。

shinyUI(bootstrapPage(
  # Add custom CSS & Javascript;
  tagList(
    tags$head(
      tags$link(rel="stylesheet", type="text/css",href="style.css"),
      tags$script(type="text/javascript", src = "busy.js")
    )
  ),
  div(class = "busy",  
      p("Calculation in progress.."), 
      img(src="http://imageshack.us/a/img827/4092/ajaxloaderq.gif")
  ),
  div(class = "span4", uiOutput("obs")),
  div(class = "span8", plotOutput("distPlot"))
))

Java脚本;

setInterval(function(){
  if ($('html').attr('class')=='shiny-busy') {
    setTimeout(function() {
      if ($('html').attr('class')=='shiny-busy') {
        $('div.busy').show()
      }
    }, 1000)
  } else {
    $('div.busy').hide()
  }
}, 100)

的style.css

div.busy { 
  position:absolute;
  top: 40%;
  left: 50%;
  margin-top: -100px;
  margin-left: -50px;
  display:none;
  background: rgba(230, 230, 230, .8);
  text-align: center;
  padding-top: 20px;
  padding-left: 30px;
  padding-bottom: 40px;
  padding-right: 30px;
  border-radius: 5px;
}

所以我的问题是如何在我的ui文件中添加自定义CSS和Javascript?我试图创建两个单独的js和css文件,但指示器不断出现在左上角。然后我试着将这两段代码直接放在R中,而绝对是语法错误。 谢谢!

问题解决了:创建一个名为“www”的文件夹,并将两个文件放入其中。

1 个答案:

答案 0 :(得分:0)

创建一个名为" www"的文件夹。并将这两个文件放入其中。