r - 该日期的sliderInput

我正在使用animationOptions中的sliderInput()制作动画。我想在滑块中使用日期/日期范围，但sliderInput()不接受日期。 Shiny 的组中有一个post。截至2013年3月，尚无解决方案。因此，我四处搜寻，并得知可以使用JavaScript来实现这一目标。这是post。不幸的是，我不能用JS编写。因此，我进行了更多搜索，并提出了this link并编写了以下代码。可以，但是滑块上的数字令人困惑。这是唯一可以在sliderInput()中移动和使用日期的方法吗？非常感谢您抽出宝贵的时间。

服务器。R

library(shiny)

shinyServer(function(input, output, session) {


observe({
    updateDateInput(session, "ana", value = as.Date("2014-07-01") + input$foo)
})

output$preImage <- renderImage({


filename <- normalizePath(file.path('./www',
                          paste(input$ana, '.png', sep='')))

list(src = filename,
     alt = paste("There is no image for ", input$ana, ".", sep = ""))

}, deleteFile = FALSE)

})

ui.R

shinyUI(pageWithSidebar(

    headerPanel("renderImage example"),

sidebarPanel(

    sliderInput("foo", "Animation duration", min = -30,
                max = 30, value = 0, step = 1,
                animate = animationOptions(loop = TRUE, interval = 1000)),

    dateInput("ana", "Choose a date:", value = as.Date("2014-07-01"))

    ),

mainPanel(

# Use imageOutput to place the image on the page
imageOutput("preImage")

    )
))

最佳答案

sliderInput控件提供了一些有限的格式设置选项。您可以在format中添加sliderInput参数，以更改滑块的显示文本。

理想情况下，您希望sliderInput提供一个自定义映射函数，该函数将当前值映射到确切的日期。但是，由于这不是选项，因此唯一需要改进的地方就是使用format参数稍微更改文本。

接受的format can be found in this document。

根据上述文档，可能可以将sliderInput更改为:

sliderInput("foo", "Animation duration", min = -30,
                max = 30, value = 0, step = 1,
                format="## Days",
                animate = animationOptions(loop = TRUE, interval = 1000)),

最初为“+10”时，它将显示为+10 Days。

可能不是您真正想要的，但是这是您无需编写Java脚本即可完成的。

编辑:使用Javascript显示自定义的滑块值

假设您确实要更改滑块的当前值标签以指示某个较为复杂的值(日期，转换后的值等)，则可以编写一些小的Javascript代码段来实现。
jslider控件提供的一个示例(这是Shiny用于sliderInput的内容)表明，通过使用calculate函数调用滑块的构造函数，您可以手动将映射从当前值(数字)更改为自定义字符串(在这种情况下，一个日期)。

不必太冗长，我们只说滑块的Javascript对象称为slider。您总是可以通过以下方式获得:

$(select).slider()

其中select是jQuery选择器。同样，在这种情况下，它是#foo，因为滑块在foo中设置了一个id ui.R。
启动后，示例中出现的slider.settings.calculate函数将绑定(bind)为slider.nice函数。因此，我们可以简单地重写nice函数来实现我们的目标。

下面是经过修改的ui.R，其中包含一段Javascript，可精确执行nice函数的覆盖。

用户界面

shinyUI(pageWithSidebar(
  headerPanel("renderImage example"),
  sidebarPanel(
    sliderInput("foo", "Animation duration", min = -30,
                max = 30, value = 0, step = 1,
                animate = animationOptions(loop = TRUE, interval = 1000)),
    dateInput("ana", "Choose a date:", value = as.Date("2014-07-01"))
  ),

  mainPanel(
    singleton(tags$head(HTML(
      '
  <script type="text/javascript">
    $(document).ready(function() {
      var slider = $("#foo").slider();
      // override the default "nice" function.
      slider.nice = function(value) {
        var ref_date = new Date("2014-07-01");
        // each slider step is 1 day, translating to 24 * 3600 * 1000 milliseconds
        var slider_date = new Date(ref_date.getTime() + value * 24 * 3600 * 1000);
        return [slider_date.getUTCFullYear(),
                slider_date.getUTCMonth() + 1,
                slider_date.getUTCDate()].join("-");
      }
    })
  </script>
'))),
    # Use imageOutput to place the image on the page
    imageOutput("preImage")
  )
))

我们可能要调整的另一个细节是滑块两端的标签。为此，我们可以:

通过调用slider.domNode替换整个slider.generateScales()；

直接使用类<span>修改两个jslider-label。

例如，如果采用方法2，则可以将HTML()的ui.R部分修改为:

    singleton(tags$head(HTML(
      '
  <script type="text/javascript">
    $(document).ready(function() {
      var slider = $("#foo").slider();
      // override the default "nice" function.
      var labels = slider.domNode.find(".jslider-label span");
      labels.eq(0).text("2014-06-01");
      labels.eq(1).text("2014-07-31");
      slider.nice = function(value) {
        var ref_date = new Date("2014-07-01");
        // each slider step is 1 day, translating to 24 * 3600 * 1000 milliseconds
        var slider_date = new Date(ref_date.getTime() + value * 24 * 3600 * 1000);
        return [slider_date.getUTCFullYear(),
                slider_date.getUTCMonth() + 1,
                slider_date.getUTCDate()].join("-");
      }
    })
  </script>
'))),

标签将显示预期的日期。

当然，这是一些快速的技巧，如果对滑块进行了其他自定义，则可能无法正常工作。

我认为Shiny团队应该以某种方式考虑在calculate中添加sliderInput选项，该选项直接映射到slider.settings.calculate，只是为了使这种事情变得更容易。

关于r - 该日期的sliderInput，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/25330025/