Bokeh widgets

add interactive components

One of Bokeh's most unique features is the ability to add widgets that add interactivity to plots. Widgets allow the user to change the view of the plot by making selections, clicking buttons and typing into textboxes.

from bokeh.io import output_file, show
from bokeh.io import output_notebook
output_notebook()

Creating a button widget

Buttons allow the user to select or activate code by clicking. In the following code the Button class is used to create a button that has the text 'click this'

see:

from bokeh.models import Button

button = Button(label="Click this")

show(button)

Creating a checkbox widget

Checkboxes allow the user to make one or more selections. They are used to select individually or mutiple plots when a plot has multiple categories to show or multiple vizualisations. In the following code the CheckboxGroup class is used to create a checkbox object with three categories. The activate argument is used to specify which category is default checked when created.

see:

from bokeh.models import CheckboxGroup 
checkbox_widget = CheckboxGroup(labels=["box: 1", "box: 2", "box:3"], 
                                        active=[1, 2]) 
show(checkbox_widget)

Creating a dropdown widget

Another selection widget is the dropdown menu. In the following code, a dropdown menu is created from the class Dropdown.

see:

from bokeh.models import Dropdown
menu_widget = [("Blood pressure", "1"), ("BPM", "2"),("Temperature", "3")]
menu_dropdown = Dropdown(label = "Measurement", menu = menu_widget)
show(menu_dropdown)

Creating a radio button widget

Radio buttons limits the user's choice to pick just one option, instead of multiple options like the checkbox. The following code shows the construction of such a button. The class `RadioGroup` is to be used to create such. Again `active` is used to activate one special button.

see: - https://docs.bokeh.org/en/latest/_modules/bokeh/models/widgets/groups.html#RadioButtonGroup - https://docs.bokeh.org/en/latest/_modules/bokeh/models/widgets/groups.html#ButtonGroup

from bokeh.models import RadioGroup 
radio_button = RadioGroup(labels = ["First radio button", "Second radio button"], 
                                   active = 0) 
show(radio_button)

Creating a slider widget

You can use sliders to decrease or increase datapoints or regions in a plot to be viewed. The following code demonstrates creating a simple slider in bokeh using the Slider object. The start and end arguments are used to specify the start and the end of the slider. The value argument specifies where the slider should start when the slider is generated. With the step argument one can specify the number of counts by which the slider would increase or decrease when it is moved to the right or left.

See:

from bokeh.models import Slider
slider_widget = Slider(start = 0, end = 100, value = 0, title = "Simple Slider", step = 5)
show(slider_widget)

Creating a text input widget

In the input text widget the user can type in text which can be linked to the changing output of the plot. The widget can be created using the TextInput object. The value argument is used to set the default value.

See:

from bokeh.models import TextInput 
text_input_widget = TextInput(title="type your text here", value = "") 
show(text_input_widget)

Last updated

Was this helpful?