Geek Answers Handbook

Brilliant slider animation speed

I was wondering if there is a way to change the speed of the slider animation in a brilliant state. So, for the slider, which (in ui.R):

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

I want to change ANIMATION SPEED , rather than saving it to a static value that I set at the beginning. In addition, animation only works when I put it in ui, so I cannot make it a reactive user interface on the server. For example, I can not do in server.R

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

and then add ui.R

 uiOutput("test_slider")

That would be ideal as I tweaked things like min and max (and probably ANIMATION SPEED ), but unfortunately it makes the play button not work and the animation just won't start. I find it difficult to dynamically change the input parameters of the slider. Even if your solution includes javascript, I would be fine with that. Thank you so much.

EDIT:

So, I have no answer yet, but I walked closer. I looked at the javascript file and added something like this (in 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"))});')) )

I have console.log to show that I am sending the correct thing, since it prints the correct value in the terminal. Then I do in server.R:

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

I use as documentation in a brilliant repo here: https://github.com/rstudio/shiny/blob/a6cd0fdb85d5d2175ebc4fcb590386e4cedcbbd9/srcjs/input_binding_slider.js

as well as the documentation contained in this blog: https://ryouready.wordpress.com/2013/11/20/sending-data-from-client-to-server-and-back-using-shiny/

For github repo, I use the part below that says

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

Where

  var self = $(this)

I have never used javascript before, so I might be missing out on something obvious. Any help is much appreciated!

+5
source share
1 answer

I'm not sure if I understand your problem, but if I do the following, follow these steps:

In 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) })

And add to ui.R:

 uiOutpout("slider_to_anim"), uiOutpout("speed_value")
+1
source

More articles:


All Articles