Title: | Create a Shiny Date-Range Input |
---|---|
Description: | A Shiny Input for date-ranges, which pops up two calendars for selecting dates, times, or predefined ranges like "Last 30 Days". It wraps the JavaScript library 'daterangepicker' which is available at <https://www.daterangepicker.com>. |
Authors: | Sebastian Gatscha [aut, cre] |
Maintainer: | Sebastian Gatscha <[email protected]> |
License: | MIT + file LICENSE |
Version: | 0.2.0.9000 |
Built: | 2024-11-05 02:56:45 UTC |
Source: | https://github.com/trafficonese/daterangepicker |
checkMaxSpan Check the maxSpan element, for Time objects
checkMaxSpan(maxSpan)
checkMaxSpan(maxSpan)
maxSpan |
The list of ranges |
checkRanges Check the ranges element, for Date or POSIX objects
checkRanges(ranges)
checkRanges(ranges)
ranges |
The list of ranges |
The Date Range Picker pops up two calendars for selecting dates, times, or predefined ranges like "Yesterday", "Last 30 Days", etc.
daterangepicker( inputId = NULL, label = "Select a Date", start = NULL, end = NULL, min = NULL, max = NULL, ranges = NULL, rangeNames = names(ranges), language = "en", style = "width:100%;border-radius:4px;text-align:center;", class = NULL, icon = NULL, options = daterangepickerOptions() )
daterangepicker( inputId = NULL, label = "Select a Date", start = NULL, end = NULL, min = NULL, max = NULL, ranges = NULL, rangeNames = names(ranges), language = "en", style = "width:100%;border-radius:4px;text-align:center;", class = NULL, icon = NULL, options = daterangepickerOptions() )
inputId |
The input ID |
label |
The label for the control, or NULL for no label. |
start |
The beginning date of the initially selected. Must be a Date / POSIXt or string. If NULL will default to the current day. |
end |
The end date of the initially selected date range. Must be a Date / POSIXt or string. If NULL will default to the current day. |
min |
The earliest date a user may select. Must be a Date or string |
max |
The latest date a user may select. Must be a Date or string |
ranges |
Set predefined date ranges the user can select from. Each key is the label for the range, and its value an array with two dates representing the bounds of the range. Alternatively, the labels can be specified via 'rangeNames'. If that argument is used, 'ranges' should not be named and 'rangeNames' will take precedence. |
rangeNames |
Optional character vector specifying the labels for predefined date ranges. If specified, it will override the names of 'ranges'. |
language |
The language used for month and day names. Default is "en". See the Multiple Locale Support for a list of other valid values. |
style |
Add CSS-styles to the input. |
class |
Custom class |
icon |
Icon to display next to the label. |
options |
List of further options. See
|
Other daterangepicker Functions:
daterangepickerOptions()
,
updateDaterangepicker()
if (interactive()) { library(shiny) library(daterangepicker) ## UI ########################## ui <- fluidPage( tags$head(tags$style(".myclass {background-color: #96dafb;}")), daterangepicker( inputId = "daterange", label = "Pick a Date", start = Sys.Date() - 30, end = Sys.Date(), max = Sys.Date(), language = "en", ranges = list( "Today" = Sys.Date(), "Yesterday" = Sys.Date() - 1, "Last 3 days" = c(Sys.Date() - 2, Sys.Date()), "Last 7 days" = c(Sys.Date() - 6, Sys.Date()) ), style = "width:100%; border-radius:4px", class = "myclass", icon = icon("calendar") ), verbatimTextOutput("print"), actionButton("act", "Update Daterangepicker"), ) ## SERVER ########################## server <- function(input, output, session) { output$print <- renderPrint({ req(input$daterange) input$daterange }) observeEvent(input$act, { updateDaterangepicker( session, "daterange", start = Sys.Date(), end = Sys.Date() - 100, ranges = list( Sys.Date(), Sys.Date() - 1, c(Sys.Date() - 3, Sys.Date()), c(Sys.Date() - 6, Sys.Date()), Sys.Date() + 2 ), rangeNames = c( "Today", "Yesterday", "Last 3 days", "Last 7 days", "The day after tomorrow \u263a" ), max = Sys.Date() + 2 ) }) } shinyApp(ui, server) }
if (interactive()) { library(shiny) library(daterangepicker) ## UI ########################## ui <- fluidPage( tags$head(tags$style(".myclass {background-color: #96dafb;}")), daterangepicker( inputId = "daterange", label = "Pick a Date", start = Sys.Date() - 30, end = Sys.Date(), max = Sys.Date(), language = "en", ranges = list( "Today" = Sys.Date(), "Yesterday" = Sys.Date() - 1, "Last 3 days" = c(Sys.Date() - 2, Sys.Date()), "Last 7 days" = c(Sys.Date() - 6, Sys.Date()) ), style = "width:100%; border-radius:4px", class = "myclass", icon = icon("calendar") ), verbatimTextOutput("print"), actionButton("act", "Update Daterangepicker"), ) ## SERVER ########################## server <- function(input, output, session) { output$print <- renderPrint({ req(input$daterange) input$daterange }) observeEvent(input$act, { updateDaterangepicker( session, "daterange", start = Sys.Date(), end = Sys.Date() - 100, ranges = list( Sys.Date(), Sys.Date() - 1, c(Sys.Date() - 3, Sys.Date()), c(Sys.Date() - 6, Sys.Date()), Sys.Date() + 2 ), rangeNames = c( "Today", "Yesterday", "Last 3 days", "Last 7 days", "The day after tomorrow \u263a" ), max = Sys.Date() + 2 ) }) } shinyApp(ui, server) }
Update the daterangepicker
daterangepickerOptions( minYear = NULL, maxYear = NULL, showDropdowns = TRUE, showCustomRangeLabel = TRUE, opens = c("right", "left", "center"), drops = c("down", "up"), timePicker = FALSE, timePickerIncrement = 1, timePicker24Hour = FALSE, timePickerSeconds = FALSE, showWeekNumbers = FALSE, showISOWeekNumbers = FALSE, parentEl = NULL, maxSpan = NULL, alwaysShowCalendars = FALSE, buttonClasses = NULL, applyButtonClasses = NULL, cancelButtonClasses = NULL, cancelIsClear = FALSE, locale = NULL, singleDatePicker = FALSE, autoApply = FALSE, linkedCalendars = TRUE, autoUpdateInput = TRUE, ... )
daterangepickerOptions( minYear = NULL, maxYear = NULL, showDropdowns = TRUE, showCustomRangeLabel = TRUE, opens = c("right", "left", "center"), drops = c("down", "up"), timePicker = FALSE, timePickerIncrement = 1, timePicker24Hour = FALSE, timePickerSeconds = FALSE, showWeekNumbers = FALSE, showISOWeekNumbers = FALSE, parentEl = NULL, maxSpan = NULL, alwaysShowCalendars = FALSE, buttonClasses = NULL, applyButtonClasses = NULL, cancelButtonClasses = NULL, cancelIsClear = FALSE, locale = NULL, singleDatePicker = FALSE, autoApply = FALSE, linkedCalendars = TRUE, autoUpdateInput = TRUE, ... )
minYear |
The minimum year as numeric shown in the dropdowns when
showDropdowns is set to |
maxYear |
The maximum year as numeric shown in the dropdowns when
showDropdowns is set to |
showDropdowns |
Show year and month select boxes above calendars to jump to a specific month and year. |
showCustomRangeLabel |
Displays "Custom Range" at the end of the list of predefined ranges, when the ranges option is used. This option will be highlighted whenever the current date range selection does not match one of the predefined ranges. Clicking it will display the calendars to select a new range. |
opens |
Whether the picker appears aligned to the |
drops |
Whether the picker appears below ( |
timePicker |
Adds select boxes to choose times in addition to dates. |
timePickerIncrement |
Increment of the minutes selection list for times (i.e. 30 to allow only selection of times ending in 0 or 30). |
timePicker24Hour |
Use 24-hour instead of 12-hour times, removing the AM/PM selection. |
timePickerSeconds |
Show seconds in the timePicker. |
showWeekNumbers |
Show localized week numbers at the start of each week on the calendars. |
showISOWeekNumbers |
Show ISO week numbers at the start of each week on the calendars. |
parentEl |
jQuery selector of the parent element that the date range picker will be added to, if not provided this will be 'body' |
maxSpan |
The maximum span between the selected start and end dates as List or table. You can provide any object the moment library would let you add to a date. |
alwaysShowCalendars |
Normally, if you use the ranges option to specify
pre-defined date ranges, calendars for choosing a custom date range are not
shown until the user clicks "Custom Range". When this option is set to
|
buttonClasses |
CSS class names that will be added to both the apply and cancel buttons. |
applyButtonClasses |
CSS class names that will be added only to the apply button. |
cancelButtonClasses |
CSS class names that will be added only to the cancel button. |
cancelIsClear |
If TRUE, will treat the Cancel Button like a Clear Button. |
locale |
Allows you to provide localized strings for buttons and labels, customize the date format, and change the first day of week for the calendars. See the examples in './inst/examples/' |
singleDatePicker |
Show only a single calendar to choose one date, instead of a range picker with two calendars. The start and end dates provided to your callback will be the same single date chosen. |
autoApply |
Hide the apply and cancel buttons, and automatically apply a new date range as soon as two dates are clicked. |
linkedCalendars |
When enabled, the two calendars displayed will always be for two sequential months (i.e. January and February), and both will be advanced when clicking the left or right arrows above the calendars. When disabled, the two calendars can be individually advanced and display any month/year. |
autoUpdateInput |
Indicates whether the date range picker should automatically update the value of the <input> element it's attached to at initialization and when the selected dates change. |
... |
Further arguments passed to 'daterangepicker', like
|
Other daterangepicker Functions:
daterangepicker()
,
updateDaterangepicker()
filterEMPTY Filter empty elements of a list
filterEMPTY(x)
filterEMPTY(x)
x |
The list of values |
makeInput Make the input div-tag
makeInput(label, inputId, class, icon, style, options)
makeInput(label, inputId, class, icon, style, options)
label |
The label of the daterangepicker |
inputId |
The inputId of the daterangepicker |
class |
The class of the daterangepicker |
icon |
The icon of the daterangepicker |
style |
The style of the daterangepicker |
options |
The options of the daterangepicker |
makeLabel Make the label
makeLabel(label, inputId)
makeLabel(label, inputId)
label |
The label of the daterangepicker |
inputId |
The inputId of the daterangepicker |
Change the start and end values of a daterangepicker on the client
updateDaterangepicker( session, inputId, label = NULL, start = NULL, end = NULL, min = NULL, max = NULL, icon = NULL, options = NULL, ranges = NULL, rangeNames = NULL, style = NULL, class = NULL )
updateDaterangepicker( session, inputId, label = NULL, start = NULL, end = NULL, min = NULL, max = NULL, icon = NULL, options = NULL, ranges = NULL, rangeNames = NULL, style = NULL, class = NULL )
session |
The session object passed to function given to shinyServer. |
inputId |
The input ID |
label |
The label for the control, or NULL for no label. |
start |
The beginning date of the initially selected. Must be a Date / POSIXt or string. If NULL will default to the current day. |
end |
The end date of the initially selected date range. Must be a Date / POSIXt or string. If NULL will default to the current day. |
min |
The earliest date a user may select. Must be a Date or string |
max |
The latest date a user may select. Must be a Date or string |
icon |
Icon to display next to the label. |
options |
List of further options. See
|
ranges |
Set predefined date ranges the user can select from. Each key is the label for the range, and its value an array with two dates representing the bounds of the range. Alternatively, the labels can be specified via 'rangeNames'. If that argument is used, 'ranges' should not be named and 'rangeNames' will take precedence. |
rangeNames |
Optional character vector specifying the labels for predefined date ranges. If specified, it will override the names of 'ranges'. |
style |
Add CSS-styles to the input. |
class |
Custom class |
Other daterangepicker Functions:
daterangepickerOptions()
,
daterangepicker()