闪亮的改变滑块动画速度

时间:2015-06-15 13:16:38

标签: r animation dynamic slider shiny

我想知道是否有办法在闪亮的情况下改变滑块的动画速度。因此,对于(在ui.R中)的滑块:

sliderInput("test_slider", 
            "Animation:", 
             min = 1, 
             max = 200, 
             value = 100, 
             animate = animationOptions(interval = ANIMATION SPEED))

我希望能够更改 ANIMATION SPEED ,而不是将其保持在我在开头设置的静态值。此外,动画仅在我将其放入ui时才有效,因此我无法将其作为服务器中的反应UI。例如,我不能在server.R

中做
output$test_slider <- renderUI({
   sliderInput("test_slider", 
               "Animation:", 
                min = 1, 
                max = 200, 
                value = 100, 
                animate = animationOptions(interval = ANIMATION SPEED))
})

然后添加ui.R

uiOutput("test_slider")

这是理想的,因为我自定义了min和max(以及可能 ANIMATION SPEED )之类的东西,但遗憾的是这样做会使播放按钮不起作用而动画只是不开始。我对如何动态更改滑块输入参数感到茫然。即使你的解决方案涉及javascript,我也会完全没问题。非常感谢。

修改

所以我还没有答案,但我已经接近了。我查看了javascript文件并添加了类似的内容(在ui.R中):

         numericInput("anim",
                      "interval: ",
                      value = 100),
         sliderInput("test_slider",
                    "Animation",
                     min = 1,
                     max = 200,
                     value = 100,
                     step = 1,
                     animate = animationOptions(interval = 700,
                               playButton = icon('play', "fa-3x"),
                               pauseButton = icon('pause', "fa-3x"))),
        singleton(
          tags$head(tags$script('Shiny.addCustomMessageHandler("testmessage",
                function(message) {$(this).attr("data-interval", message.interval); 
                                console.log($(this).attr("data-interval"))});'))
          )

我有console.log只是为了表明我正在发送正确的东西,因为它在终端中打印正确的值。然后我在server.R:

  observe({
    if(!is.null(input$anim)) {
      session$sendCustomMessage(type = "testmessage", 
                                message = list(interval = input$anim,
                                         controller = input$test_slider))
    }
  })

我在这里使用闪亮回购中的文档: https://github.com/rstudio/shiny/blob/a6cd0fdb85d5d2175ebc4fcb590386e4cedcbbd9/srcjs/input_binding_slider.js

以及此博客上的文档: https://ryouready.wordpress.com/2013/11/20/sending-data-from-client-to-server-and-back-using-shiny/

github repo的那个我正在使用下面的部分

animInterval = self.attr("data-interval")

其中

 var self = $(this)

我之前从未真正使用过javascript,所以我可能会遗漏一些明显的东西。非常感谢任何帮助!

1 个答案:

答案 0 :(得分:1)

我不确定我是否理解您的问题,但如果我这样做,则可以使用以下内容:

在server.R中:

output$slider_to_anim <- renderUI({
  sliderInput("slider", 
           "Animation:", 
            min = 1, 
            max = 200, 
            value = 100, 
            animate = animationOptions(interval = input$speed))
})

output$speed_value <- renderUI({
  numericInput("speed","Speed Value :",value = 100)
})

并加入ui.R:

uiOutpout("slider_to_anim"),
uiOutpout("speed_value")