Data visualization plays a critical role in interpreting large volumes of information. Tools like Bokeh have emerged as popular solutions for building interactive dashboards and reports. Each tool brings unique advantages depending on the complexity of your project and your preferred programming language. In this article, we will delve into each tool and then focus on Bokeh, including a hands-on example and deployment in the cloud.

So that...

What is bokeh?
Bokeh is an interactive visualization library that targets modern web browsers for presentation. It offers elegant and concise graphics, enabling developers to build dashboards with advanced interactivity. Bokeh is particularly suitable for data scientists and developers using Python, offering both high-level interfaces and granular control over your plots.

How can you use this tool?

• Install dependencies:

pip install bokeh
pip install gunicorn

• Create the plot: In this case i developed two plots in the main page then i called "app.py"

from bokeh.layouts import column
from bokeh.models import ColumnDataSource, Select
from bokeh.plotting import figure, curdoc
import numpy as np

# Sample data for line plot
line_data = {
    'x': [1, 2, 3, 4, 5],
    'y1': [6, 7, 2, 4, 7],
    'y2': [1, 4, 8, 6, 9]
}

# Data for scatter plot
N = 4000
x_scatter = np.random.random(size=N) * 100
y_scatter = np.random.random(size=N) * 100
radii = np.random.random(size=N) * 1.5
colors = np.array([(r, g, 150) for r, g in zip(50   2 * x_scatter, 30   2 * y_scatter)], dtype="uint8")

# Create ColumnDataSource for line plot
source = ColumnDataSource(data={'x': line_data['x'], 'y': line_data['y1']})

# Create a figure for line plot
plot_line = figure(title="Interactive Line Plot", x_axis_label='X', y_axis_label='Y')
line1 = plot_line.line('x', 'y', source=source, line_width=3, color='blue', legend_label='y1')
line2 = plot_line.line('x', 'y2', source=source, line_width=3, color='red', legend_label='y2', line_alpha=0.5)

# Create a figure for scatter plot
plot_scatter = figure(title="Scatter Plot", tools="hover,crosshair,pan,wheel_zoom,zoom_in,zoom_out,box_zoom,undo,redo,reset,tap,save,box_select,poly_select,lasso_select,examine,help")
plot_scatter.circle(x_scatter, y_scatter, radius=radii,
                    fill_color=colors, fill_alpha=0.6,
                    line_color=None)

# Dropdown widget to select data for line plot
select = Select(title="Y-axis data", value='y1', options=['y1', 'y2'])

# Update function to change data based on selection
def update(attr, old, new):
    selected_y = select.value
    source.data = {'x': line_data['x'], 'y': line_data[selected_y]}
    # Update line colors based on selection
    line1.visible = (selected_y == 'y1')
    line2.visible = (selected_y == 'y2')
    plot_line.title.text = f"Interactive Line Plot - Showing {selected_y}"

select.on_change('value', update)

# Arrange plots and widgets in a layout
layout = column(select, plot_line, plot_scatter)

# Add layout to current document
curdoc().add_root(layout)
`

Create your page in heroku and make the next to steps.

• Create a Procfile:

In this file declare for example in my case.

web: bokeh serve --port=$PORT --address=0.0.0.0 --allow-websocket-origin=juancitoelpapi-325d94c2c6c7.herokuapp.com app.py

• Create requeriments: In the project create requirements.txt and write and save

bokeh

• Push your project:

It's similar when you push a project in git but in this case the final master push is in heroku

git init
git add .
git commit -m "Deploy Bokeh app with Gunicorn"
git push heroku master

• And Finally ...

You can see your page with the plots bokeh.

• Conclusion

The real power of Bokeh lies in its ability to deliver interactive dashboards in web environments, making it ideal for real-time data monitoring and large datasets. By using Gunicorn to deploy Bokeh applications on cloud services like Heroku, you can build scalable, production-ready dashboards that are easy to maintain and update.