Plotting holoviews plot

Using Streamlit
1

Hi,

I would like to plot an interactive Holoviews plot with streamlit.
Is this possible? If so, how can I can do this?

Here’s an example of generating a holoviews (bokeh) plot with hvplot. The example of the line_chart works, but displaying my interactive holoviews plot doesn’t work.

# import libraries
import streamlit as st

import numpy as np
import pandas as pd

import hvplot
import hvplot.pandas

import holoviews as hv
hv.extension('bokeh', logo=False)

# create sample data
@st.cache
def get_data():
    return pd.DataFrame(data=np.random.normal(size=[50, 2]), columns=['col1', 'col2'])

df = get_data()

# streamlit plotting works
st.line_chart(df)

# creating a holoviews plot
nice_plot = df.hvplot(kind='scatter')

# this doesn't work unfortunately. How can i show 'nice_plot'
st.bokeh_chart(nice_plot)
5 Likes
2

Hi @SandervandenOord! Welcome to the Streamlit community! :hugs:

I believe the incantation you’re looking for is:

st.bokeh_chart(hv.render(nice_plot, backend='bokeh'))

Also, since hv.render(..., backend='bokeh') has type bokeh.plotting.figure.Figure, you could also just use:

st.write(hv.render(nice_plot, backend='bokeh'))

Please let us know if you have further questions!

6 Likes
3

@Adrien_Treuille thank you for that! I wonder if you all might be open to a top-level API call, such as st.hvplot(nice_plot) that automagically wraps hv.render in there? If so, I’m happy to write the PR that makes this happen.

2 Likes
4

Thanks for the offer — that would be amazing!

Depending on how much code this turns out to be, though, a good strategy would be to send out working sketch of the solution in a PR with the WIP label, so we can discuss architecture there before you do too much coding. Up to you, though.

1 Like
5

This is a great idea, but st.hvplot has a bit of a name conflict with the package hvplot. Perhaps st.hv would be enough?

For a more general solution, I just opened a new issue with the suggestion that streamlit look on objects for a particular method and use that if provided.

1 Like
6

@jsignell I think your idea is even better than the one I thought of!

7

Hi ,
using the same code plots the figure twice …

pfig = hv.Graph.from_networkx(G, nx.layout.spring_layout) \
                .redim.range(**padding) \
                .options(color_index='color_att', cmap='Category20', fontsize={'label': 1})

st.bokeh_chart(hv.render(pfig , backend='bokeh'))

any idea?
thanx !!

8

Hi !
I would like to plot holoviews chord graph in streamlit but my code show nothing,
any help could are welcome thanks.
this is my code:

from chord import Chord
import holoviews as hv
from holoviews import opts, dim
from bokeh.plotting import show, output_file
pd.set_option("display.max_columns",11)
hv.extension('bokeh')
hv.output(size = 200)


data = hv.Dataset((list(df.columns), list(df.index), df),
		                  ['source', 'target'], 'value').dframe()
pd.set_option("display.max_columns",11)
		hv.extension('bokeh')
		hv.output(size = 200)
		nice_plot = hv.Chord(data)
		nice_plot.opts(
		    node_color='index', edge_color='source', label_index='index', 
		    cmap='Category10', edge_cmap='Category10', width=500, height=500)
st.bokeh_chart(hv.render(nice_plot, backend='bokeh'))
9

Hi @lazeni, welcome to the Streamlit community!

What happens if you just make the call st.bokeh_chart(nice_plot)?

10

I got this error ,

raise ValueError("OutputDocumentFor expects a sequence of Models")
1 Like
11

this a sample of my data image

12

@randyzwitch looks like the same problem here

13

@randyzwitch @lazeni

Figured it out, a little bit of dependency problems:

downgrade to bokeh 2.2.2
donwgrade to panel 0.10