In [ ]:

import datetime as dt
import panel as pn

pn.extension()

The DateRangeSlider widget allows selecting a date range using a slider with two handles.

For more information about listening to widget events and laying out widgets refer to the widgets user guide. Alternatively you can learn how to build GUIs by declaring parameters independently of any specific widgets in the param user guide. To express interactivity entirely using Javascript without the need for a Python server take a look at the links user guide.

Parameters:¶

For layout and styling related parameters see the customization user guide.

Core¶

start (datetime): The range's lower bound
end (datetime): The range's upper bound
value (tuple): Tuple of upper and lower bounds of the selected range expressed as datetime types
value_throttled (tuple): Tuple of upper and lower bounds of the selected range expressed as datetime types where events are throttled by callback_throttle value.

Display¶

bar_color (color): Color of the slider bar as a hexadecimal RGB value
callback_policy (str, DEPRECATED): Policy to determine when slider events are triggered (one of 'continuous', 'throttle', 'mouseup')
callback_throttle (int): Number of milliseconds to pause between callback calls as the slider is moved
direction (str): Whether the slider should go from left to right ('ltr') or right to left ('rtl')
disabled (boolean): Whether the widget is editable
name (str): The title of the widget
orientation (str): Whether the slider should be displayed in a 'horizontal' or 'vertical' orientation.
tooltips (boolean): Whether to display tooltips on the slider handle

The slider start and end can be adjusted by dragging the handles and whole range can be shifted by dragging the selected range.

In [ ]:

date_range_slider = pn.widgets.DateRangeSlider(
    name='Date Range Slider',
    start=dt.datetime(2017, 1, 1), end=dt.datetime(2019, 1, 1),
    value=(dt.datetime(2017, 1, 1), dt.datetime(2018, 1, 10))
)

date_range_slider

DateRangeSlider.value returns a tuple of datetime values that can be read out and set like other widgets:

In [ ]:

date_range_slider.value

Controls¶

The DateRangeSlider widget exposes a number of options which can be changed from both Python and Javascript. Try out the effect of these parameters interactively:

In [ ]:

pn.Row(date_range_slider.controls(jslink=True), date_range_slider)