Voila not rendering any widget while all working properly on Jupyter

Widgets
1

I am using a bunch of ipywidgets in my notebook. Voila gets stuck at “Running …” phase to spin forever, while working properly on Jupyter Lab. I don’t have an issue with my voila setup, because if I put some print statements and remove display, voila loads the page and loads my print lines. Here is the minimal example (the most minimal version I could create :sweat_smile:):

import pandas as pd
import plotly.express as px
import ipywidgets as widgets
from IPython.display import display

def update_filter_widgets(change):
    if filter_checkbox.value and type_dropdown.value == "t2":
        visibility = "visible"
        slider.value = 1.5 if method_dropdown.value == 'm1' else 3.0
    else:
        visibility = "hidden"
    method_dropdown.layout.visibility = visibility
    slider.layout.visibility = visibility

def update_filter_checkbox(change):
    if type_dropdown.value == "t1":
        filter_checkbox.layout.visibility = "hidden"
    else:
        filter_checkbox.layout.visibility = "visible"
    update_filter_widgets(None)

def update_plot(file, plot_type, filter, method, padding):
    if file == "f1":
        data = pd.DataFrame([l.split('\t') for l in f1], columns=['c1', 'c2', 'c3'])
    else:
        data = pd.DataFrame([l.split('\t') for l in f2], columns=['c1', 'c2', 'c3'])
    data['c3'] = pd.to_numeric(data['c3'])

    if filter:
        tmp = data['c3'] + padding
        data['c3'] = tmp / 2 if method == "m1" else tmp / 4

    if plot_type == "t1":
        fig = px.line(data, x="c1", y="c2")
    else:
        fig = px.line(data, x="c1", y="c3")
    fig.show()

f1 = ["10:36:00\t00:00:00\t0.08", "10:41:00\t08:00:00\t0.04"]
f2 = ["11:06:00\t04:00:00\t2.07", "11:11:00\t16:00:00\t1.85"]

file_dropdown = widgets.Dropdown(options=["f1", "f2"], description="File: ")
type_dropdown = widgets.Dropdown(options=["t1", "t2"], description="Type: ")
method_dropdown = widgets.Dropdown(options=["m1", "m2"], value="m1", description="Method")
filter_checkbox = widgets.Checkbox(value=False, description="Filter")
slider = widgets.FloatSlider(value=1.5, min=0, max=5, step=0.1, description="Threshold")

type_dropdown.observe(update_filter_checkbox, names='value')
filter_checkbox.observe(update_filter_widgets, names='value')
method_dropdown.observe(update_filter_widgets, names='value')

update_filter_checkbox(None)

interactive_plot = widgets.interactive(update_plot, file=file_dropdown, plot_type=type_dropdown,
    filter=filter_checkbox, method=method_dropdown, padding=slider)

display(interactive_plot)

After reading about some issues of voila with ipywidgets 8, I downgraded it to 7.6.5 and 7.7.2, but this didn’t help.

2

You shouldn’t need display() involved with this and so from the little you’ve provided, I’m not quite following what you are having an issue with.
Beyond that, It is hard to provide you with much feedback on what may work better (or see if it indeed doesn’t work like you may be reporting), or with what versions of software, since your provided code is not a complete minimal reproducible example.

I can point to a complete version of code that works in Voila here to display a plot. You’ll note that display() is not explicitly needed as it is handled by Voila rendering process. Keep in mind though that example is completely unrelated to you and your issues though; it just happened to be something I had handy that involved a plot.

From what you’ve said prior in this post, that approach wouldn’t be testing any of the stuff giving you issues.

3

First of all, thank you for the reply! You were right, so I updated my message with an MRE. It does not change anything if I use the approach you shared:

out_vbox = widgets.VBox([interactive_plot])
out_vbox
5

This is quite interesting. I’ve just tested this MRE again, and it seems to be working.

Screenshot 2023-11-22 at 17.12.55
Screenshot 2023-11-22 at 17.12.552786×982 93 KB

These are the versions in my requirements.txt:
jupyterlab==4.0.9
pandas==2.1.3
plotly==5.18.0
ipywidgets==8.1.1

6

Is what you are showing in your last reply from Voila? Or JupyterLab?

Sorry, I was installing Plotly after that particular session started and it doesn’t seem to reflect what I should see fully because upon further checking I was seeing simpler code involving Plotly fail, too. So nevermind what I had written earlier today as a reply (I deleted that reply, in fact.)

Progress!
Your current MRE does work in JupyterLab (v3.4.8) in an environment where Plotly works well. (Curiously, I do see the blank space when I try in Jupyter NbClassic 0.5.5 interface running in the same session though. However, that doesn’t seem pertinent because you aren’t using that. Just noting because maybe it is something others may be interested in.) Your current MRE also works in Voila well, too. I can share a temporary session where you can see it working: click here and open a new notebook in the JupyterLab interface, paste in your code and save the .ipynb file, and then press on the Voila icon sybol on the toolbar ribbon above the notebook (the yellow squiggle over the bright green line) to render it in Voila.

Here are some pertinent versions I see where it works in Voila:
ipywidgets 8.0.2
plotly 5.14.1
voila 0.4.0

1 Like
7

What I was showing was from JupyterLab.

Thank you for the versions you shared! Actually, those versions helped my MRE to run on Voila. Then I immediately swapped it with my real code, it works with these package versions on Voila too, but with one warning:

my_project/venv/lib/python3.11/site-packages/_plotly_utils/basevalidators.py:106: FutureWarning:

The behavior of DatetimeProperties.to_pydatetime is deprecated, in a future version this will return a Series containing python datetime objects instead of an ndarray. To retain the old behavior, call `np.array` on the result

Changing plotly version to 5.18.0 solved this warning as well. It seems that I am good to go now. Thanks for your help!

1 Like