在dateRangeInput或dateInput中仅显示数月的闪亮应用程序[R编程]

时间:2015-07-01 05:10:45

标签: r shiny

我使用闪亮来创建一个网络应用程序。我的一个图表仅使用特定年份的几个月来生成图中的点。

我希望用户只选择月份。虽然我已经提到了

format = 'mm-yyyy'startview = 'year'中的

dateInputdateRangeInput

每当用户点击日期输入字段时,用户将显示月份,然后点击用户显示的月份中的任何月份。

我希望用户能够显示到几个月。如果用户点击月份,则不应显示日期。

如何实现这一目标?

4 个答案:

答案 0 :(得分:11)

我不相信mydateInput <- function(inputId, label, value = NULL, min = NULL, max = NULL, format = "yyyy-mm-dd", startview = "month", weekstart = 0, language = "en", minviewmode="months", width = NULL) { # If value is a date object, convert it to a string with yyyy-mm-dd format # Same for min and max if (inherits(value, "Date")) value <- format(value, "%Y-%m-%d") if (inherits(min, "Date")) min <- format(min, "%Y-%m-%d") if (inherits(max, "Date")) max <- format(max, "%Y-%m-%d") htmltools::attachDependencies( tags$div(id = inputId, class = "shiny-date-input form-group shiny-input-container", style = if (!is.null(width)) paste0("width: ", validateCssUnit(width), ";"), controlLabel(inputId, label), tags$input(type = "text", # datepicker class necessary for dropdown to display correctly class = "form-control datepicker", `data-date-language` = language, `data-date-weekstart` = weekstart, `data-date-format` = format, `data-date-start-view` = startview, `data-date-min-view-mode` = minviewmode, `data-min-date` = min, `data-max-date` = max, `data-initial-date` = value ) ), datePickerDependency ) } `%AND%` <- function(x, y) { if (!is.null(x) && !is.na(x)) if (!is.null(y) && !is.na(y)) return(y) return(NULL) } controlLabel <- function(controlName, label) { label %AND% tags$label(class = "control-label", `for` = controlName, label) } datePickerDependency <- htmlDependency( "bootstrap-datepicker", "1.0.2", c(href = "shared/datepicker"), script = "js/bootstrap-datepicker.min.js", stylesheet = "css/datepicker.css") 已将bootstrap minViewMode option作为函数参数实现,因此我将其添加到我自己的函数副本中(参见下文)。我不得不添加一些其他必需的功能。这不是很好。最好的选择可能是向RStudio提交请求,因为添加这个minviewmode选项似乎很简单。

.navbar {
    height: 110px;
    background: #2476bf;
}
.collapse.navbar-collapse {
    max-width: 850px;
    height: 110px ;
}
.menu-item a {
    height: 110px;
    width: 200px;
}
li.menu-item.menu-item-object-page a, .menu-item-type-custom, .menu-item-type-custom.menu-item-object-custom.menu-item-2413 a {
    text-align: center;
    line-height: 90px;
    font-family: 'Pacifico', cursive ;
    font-size: 1.5em;

}
.collapse.navbar-collapse {
    float: right;
}

答案 1 :(得分:9)

@MartinJohnHadley:基本上通过添加相同的三行@StevenMortimer将dateInput的代码添加到dateRangeInput。这会将minViewMode添加到shinys dateRangeInput。

  1. https://github.com/rstudio/shiny/blob/master/R/input-daterange.R
  2. 找到代码
  3. 添加默认参数minviewmode="months"
  4. data-date-min-view-mode = minviewmode添加到两个div
  5. 添加缺少的参数(在github存档中搜索闪亮的)
  6. 享受自定义dateRange输入: - )
  7. 祝你好运, 桑德罗

    代码:

    dateRangeMonthsInput <- function(inputId, label, start = NULL, end = NULL,
                                min = NULL, max = NULL, format = "yyyy-mm-dd", startview = "month",
                                minviewmode="months", # added manually
                                weekstart = 0, language = "en", separator = " to ", width = NULL) {
    
       # If start and end are date objects, convert to a string with yyyy-mm-dd format
       # Same for min and max
       if (inherits(start, "Date"))  start <- format(start, "%Y-%m-%d")
       if (inherits(end,   "Date"))  end   <- format(end,   "%Y-%m-%d")
       if (inherits(min,   "Date"))  min   <- format(min,   "%Y-%m-%d")
       if (inherits(max,   "Date"))  max   <- format(max,   "%Y-%m-%d")
    
       htmltools::attachDependencies(
         div(id = inputId,
             class = "shiny-date-range-input form-group shiny-input-container",
             style = if (!is.null(width)) paste0("width: ", validateCssUnit(width), ";"),
    
             controlLabel(inputId, label),
             # input-daterange class is needed for dropdown behavior
             div(class = "input-daterange input-group",
                 tags$input(
                   class = "input-sm form-control",
                   type = "text",
                   `data-date-language` = language,
                   `data-date-weekstart` = weekstart,
                   `data-date-format` = format,
                   `data-date-start-view` = startview,
                   `data-date-min-view-mode` = minviewmode, # added manually
                   `data-min-date` = min,
                   `data-max-date` = max,
                   `data-initial-date` = start
                 ),
                 span(class = "input-group-addon", separator),
                 tags$input(
                   class = "input-sm form-control",
                   type = "text",
                   `data-date-language` = language,
                   `data-date-weekstart` = weekstart,
                   `data-date-format` = format,
                   `data-date-start-view` = startview,
                   `data-date-min-view-mode` = minviewmode, # added manually
                   `data-min-date` = min,
                   `data-max-date` = max,
                   `data-initial-date` = end
                 )
             )
         ),
         datePickerDependency
       )
     }
    
     `%AND%` <- function(x, y) {
       if (!is.null(x) && !is.na(x))
         if (!is.null(y) && !is.na(y))
           return(y)
       return(NULL)
     }
    
     controlLabel <- function(controlName, label) {
       label %AND% tags$label(class = "control-label", `for` = controlName, label)
     }
    
     # the datePickerDependency is taken from https://github.com/rstudio/shiny/blob/master/R/input-date.R
     datePickerDependency <- htmltools::htmlDependency(
     "bootstrap-datepicker", "1.6.4", c(href = "shared/datepicker"),
     script = "js/bootstrap-datepicker.min.js",
     stylesheet = "css/bootstrap-datepicker3.min.css",
     # Need to enable noConflict mode. See #1346.
     head = "<script>
     (function() {
     var datepicker = $.fn.datepicker.noConflict();
     $.fn.bsDatepicker = datepicker;
     })();
     </script>")
    

答案 2 :(得分:4)

谁想要使用上一个答案中的代码: 您需要使用更新的datePickerDependecy(可以从https://github.com/rstudio/shiny/blob/master/R/input-date.R获取)。

目前是:

datePickerDependency <- htmlDependency(
"bootstrap-datepicker", "1.6.4", c(href = "shared/datepicker"),
script = "js/bootstrap-datepicker.min.js",
stylesheet = "css/bootstrap-datepicker3.min.css",
# Need to enable noConflict mode. See #1346.
head = "<script>
(function() {
var datepicker = $.fn.datepicker.noConflict();
$.fn.bsDatepicker = datepicker;
})();
</script>")

由于声誉不够,我将此评论作为答案发布:(

答案 3 :(得分:1)

这是另一种方法(由同事提供)(具有较少的代码冗余,希望更简单)。可以复制min / max-view-mode部分到Shiny对象,而不是复制Shiny :: dateInput函数代码。然后可以按预期使用旧参数“ startview”和新的“ minview” /“ maxview”:

library(shiny)
shinyApp(
  ui = fluidPage(
    dateInput2("test1", "Year", startview = "year", minview = "months", maxview = "decades"),
    dateRangeInput2("test2", "Years", startview = "year", minview = "months", maxview = "decades")
  ),
  server = function(input, output, session) {}
)

这是一个最小的Shiny示例:

docker build --tag=friendlyhello .

更新

为解决darKnight的以下问题,我扩展了示例并引入了一个参数,该参数还用于设置最大可选时间分辨率。有关可能的参数的完整列表,请参阅:

https://bootstrap-datepicker.readthedocs.io/en/latest/options.html