Interactive Plots Integration (Plotly, Bokeh, Highcharts)

PyBloqs also supports plotting with interactive plotting libraries such as Plotly(offline), Bokeh and Highcharts.

The plots will be rendered in HTML and will rely on your browser’s CSS and JS capabilities to provide interactivity.

Plotly Example

import plotly.express as px

df = px.data.gapminder().query("country=='Canada'")
plotly_fig = px.line(df, x="year", y="lifeExp", title="Life expectancy in Canada")
plotly_fig

import pybloqs as p

p.Block(plotly_fig)

Bokeh Example

import numpy as np

# The lines below are only needed for notebook output
from bokeh.io.output import output_notebook
from bokeh.plotting import figure as b_fig
from bokeh.resources import INLINE

output_notebook(resources=INLINE)

Loading BokehJS ...

N = 4000
x = np.random.random(size=N) * 100
y = np.random.random(size=N) * 100
radii = np.random.random(size=N) * 1.5
colors2 = [
    f"#{int(r):02x}{int(g):02x}{150:02x}" for r, g in zip(50 + 2 * x, 30 + 2 * y)
]
bokeh_fig = b_fig(width=300, height=300)
bokeh_fig.scatter(
    x, y, radius=radii, fill_color=colors2, fill_alpha=0.6, line_color=None
)

BokehDeprecationWarning: 'scatter(radius=...)' was deprecated in Bokeh 3.4.0 and will be removed, use 'circle(radius=...) instead' instead.

GlyphRenderer(

id = 'p1041', …)

context_menu = None,

coordinates = None,

css_classes = [],

css_variables = {},

data_source = ColumnDataSource(id='p1035', ...),

glyph = Circle(id='p1038', ...),

group = None,

hover_glyph = None,

js_event_callbacks = {},

js_property_callbacks = {},

level = 'glyph',

muted = False,

muted_glyph = Circle(id='p1040', ...),

name = None,

nonselection_glyph = Circle(id='p1039', ...),

propagate_hover = False,

selection_glyph = 'auto',

styles = {},

stylesheets = [],

subscribed_events = PropertyValueSet(),

syncable = True,

tags = [],

view = CDSView(id='p1042', ...),

visible = True,

x_range_name = 'default',

y_range_name = 'default')

p.Block(bokeh_fig)