Bokeh is a powerful Python library for creating interactive visualizations for modern web browsers. Unlike Matplotlib, which primarily produces static images, Bokeh is designed to generate interactive plots, dashboards, and data applications that users can explore directly.

Its main goal is to provide an elegant and concise way to create beautiful, high-performance graphics without needing to write any JavaScript. This makes it an excellent choice for data scientists and developers who want to build web-based dashboards or present data in a more engaging and explorable format.

Key Concepts

• Glyphs: These are the fundamental visual building blocks of a Bokeh plot. Examples include circles, lines, squares, and bars. You add glyphs to a plot to represent your data.

• Interactive Tools: Bokeh plots come with a configurable toolbar that can include tools for panning, zooming, selecting data points, and hovering to see more information.

• Server and Standalone: Bokeh can be used in two main ways:

• Standalone HTML: You can generate a self-contained HTML file that includes your plot and all the necessary data and libraries to make it interactive. This is great for embedding in web pages or sharing.

• Bokeh Server: For more complex applications, you can run a dedicated Bokeh server. This allows you to build sophisticated dashboards that can react to user input, update plots in real-time, and stream large datasets.

To run these examples, you first need to install Bokeh: pip install bokeh

Code Examples

1. Simple Interactive Scatter Plot

This example creates a basic scatter plot with interactive tools like pan, zoom, and a hover tool that displays the coordinates of each point.

from bokeh.plotting import figure, show

from bokeh.models import HoverTool

# Sample data

x_coords = [1, 2, 3, 4, 5, 6, 7, 8]

y_coords = [6, 7, 2, 4, 5, 9, 5, 8]

# Define the hover tool to show information when you mouse over a point

# '$x' and '$y' are special variables that refer to the coordinates

hover = HoverTool(tooltips=[

    ("Index", "$index"),

    ("X-Value", "$x"),

    ("Y-Value", "$y"),

])

# Create a new plot with a title, axis labels, and the hover tool

# The 'tools' argument specifies which interactive tools to include

p = figure(

    title="Simple Scatter Plot",

    x_axis_label='X-Axis',

    y_axis_label='Y-Axis',

    tools=[hover, "pan,wheel_zoom,box_zoom,reset"]

)

# Add a circle glyph to the plot to represent the data

p.circle(x_coords, y_coords, size=15, color="navy", alpha=0.6)

# Show the results (this will open a new browser tab)

show(p)

2. Line Plot with Multiple Lines

This example shows how to plot multiple lines on the same figure and includes a legend that can be used to hide or mute lines interactively.

import numpy as np

from bokeh.plotting import figure, show

# Prepare some data

x = np.linspace(0, 4 * np.pi, 100)

y_sin = np.sin(x)

y_cos = np.cos(x)

# Create a new plot

p = figure(

    title="Sine and Cosine Curves",

    x_axis_label='x',

    y_axis_label='y',

    width=800,

    height=400

)

# Add a line glyph for the sine wave

p.line(x, y_sin, legend_label="Sine Wave", color="blue", line_width=2)

# Add a line glyph for the cosine wave

p.line(x, y_cos, legend_label="Cosine Wave", color="red", line_width=2, line_dash="dashed")

# Customize the legend

p.legend.location = "top_left"

p.legend.click_policy = "hide"  # Allows you to hide lines by clicking the legend

# Show the results

show(p)

3. Bar Chart with Categorical Data

Bokeh handles categorical data well, making it easy to create bar charts. This example also demonstrates how to use a ColumnDataSource for more structured data handling.

from bokeh.plotting import figure, show

from bokeh.models import ColumnDataSource

# Data for the bar chart

products = ['Laptops', 'Monitors', 'Keyboards', 'Mice']

sales_2024 = [150, 220, 310, 450]

sales_2025 = [180, 250, 290, 400]

# Create a ColumnDataSource - this is the standard way to pass data to Bokeh

source = ColumnDataSource(data=dict(

    products=products,

    sales_2024=sales_2024,

    sales_2025=sales_2025

))

# Create a new plot with the product names on the x-axis

p = figure(

    x_range=products,

    height=350,

    title="Product Sales Comparison",

    toolbar_location=None, # Disable the toolbar for a cleaner look

    tools=""

)

# Add vertical bar glyphs. We use vbar for vertical bars.

# The 'x' and 'top' arguments refer to the column names in the ColumnDataSource.

p.vbar(x='products', top='sales_2024', width=0.4, source=source, legend_label="2024 Sales", color="#718dbf")

p.vbar(x='products', top='sales_2025', width=0.4, source=source, legend_label="2025 Sales", color="#e84d60")

# Customize the plot appearance

p.xgrid.grid_line_color = None

p.y_range.start = 0

p.legend.orientation = "horizontal"

p.legend.location = "top_center"

# Show the results

show(p)