Displaying a Plotly Plot

Plotly is one of the most popular plotting libraries in the python ecosystem, and zero-true has built in integrations for working with it. There is some slight nuance to how to work with plotly in zero-true though so take a look at the example below:

import plotly.graph_objects as go
import zero_true as zt

# Create a basic line plot in Plotly
fig = go.Figure()

# Add data to the plot
fig.add_trace(go.Scatter(x=[0, 1, 2, 3], y=[10, 20, 25, 30], mode='lines', name='Data Line'))

# Add labels and a title
fig.update_layout(
    title='Basic Line Plot',
    xaxis_title='X Label',
    yaxis_title='Y Label')

# Render the plot in zero-true
zt.plotlyComponent(id='plt', figure=fig)

Run the cell in your notebook, and watch the line plot appear below! Plotly components require an ID as well as a plotly figure passed as arguments to render. Since plotly plots are static components in zero-true there are no values for you to access that users interact with. However you can set interactivity into the plot by using things like hovertext etc that are built into the plotly library!

Interactive Plotly Plots in Zero-True

Let’s take the code above and make it a little bit more exciting by interactively setting the last Y value in the plot:

import plotly.graph_objects as go
import zero_true as zt

slider=zt.Slider(id='slider',min=0,max=50)

# Create a basic line plot in Plotly
fig = go.Figure()

# Add data to the plot
fig.add_trace(go.Scatter(x=[0, 1, 2, 3], y=[10, 20, 25, slider.value], mode='lines', name='Data Line'))

# Add labels and a title
fig.update_layout(
    title='Basic Line Plot',
    xaxis_title='X Label',
    yaxis_title='Y Label')

# Render the plot in zero-true
zt.plotlyComponent(id='plt', figure=fig)

Combining plotly’s incredible plotting capabilities with zero-true’s interactive notebook and UI can help take your visualization game to the next level.