Modifying glyph size with a widget

Another area of interest for the hedge fund is pharmaceuticals as there is a lot of innovation taking place, which creates opportunities for new start-ups and scale-ups.

You have been asked to produce a scatter plot displaying the value and volume of stocks for five pharmaceutical companies within the dataset - AbbVie, Eli Lilly, Merck, Johnson & Johnson, and Nuformix. You aren't sure how the data will look, so decide to use the Spinner widget, allowing stakeholders to customize glyph size if needed.

This exercise is part of the course

Interactive Data Visualization with Bokeh

View Course

Exercise instructions

Import layout and Spinner.
Create a spinner titled "Glyph size", with sizes ranging from 1 to 30 pixels, changing by 1 pixel with each click, a default value of 4, and a width of 60.
Complete spinner.js_link(), first passing "value", followed by the scatter's glyph attribute, and lastly specifying "size" as the attribute you wish to modify using the spinner.
Display the layout, with title on a single row, and a second row showing the spinner and fig in that order.

Hands-on interactive exercise

Have a go at this exercise by completing this sample code.

# Import modules
____
____
labels = ["ABBV", "JNJ", "LLY", "MRK", "NFX"]
fig = figure(x_axis_label="Volume", y_axis_label="Stock Price ($)")
scatter = fig.circle(x="volume", y="close", source=source, legend_field="name", fill_color=factor_cmap("name", palette=Category10_5, factors=labels), fill_alpha=0.5)
title = Div(text="Pharmaceuticals Stock Performance")
fig.xaxis[0].formatter = NumeralTickFormatter(format="0a")

# Create spinner
spinner = ____(title="____", low=____, high=____, step=____, value=____, width=____)

# Set up the widget action
spinner.js_link("____", ____.____, "____")
output_file(filename="pharma_stocks.html")

# Display the layout
show(____(____))

Edit and Run Code