Notebook

In [ ]:

import math
import panel as pn
pn.extension()

The RangeSlider widget allows selecting a floating-point 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 (float): The range's lower bound
end (float): The range's upper bound
step (float): The interval between values
value (tuple): Tuple of upper and lower bounds of selected range
value_throttled (tuple): Tuple of upper and lower bounds of selected range throttled until mouseup

Display¶

bar_color (color): Color of the slider bar as a hexadecimal RGB value
direction (str): Whether the slider should go from left to right ('ltr') or right to left ('rtl')
disabled (boolean): Whether the widget is editable
format (str, bokeh.models.TickFormatter): Formatter to apply to the slider value
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

In [ ]:

range_slider = pn.widgets.RangeSlider(
    name='Range Slider', start=0, end=math.pi, value=(math.pi/4., math.pi/2.), step=0.01)

range_slider

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

In [ ]:

range_slider.value

A custom format string or bokeh TickFormatter may be used to format the slider values:

In [ ]:

from bokeh.models.formatters import PrintfTickFormatter

str_format = pn.widgets.RangeSlider(name='Distance', format='0.0a', start=100000, end=1000000)

tick_format = pn.widgets.RangeSlider(name='Distance', format=PrintfTickFormatter(format='%.3f m'))

pn.Column(str_format, tick_format)

Controls¶

The RangeSlider 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(range_slider.controls(jslink=True), range_slider)