ipywidgets and plotly problem. Plot not being displayed after first call

Question

I am trying to create a dashboard that contains plotly graphs and ipython widgets inside a jupyter notebook. But i'm having a very annoying problem: the function doesn't show any chart when the cell is executed for the first time. It only shows after interacting with its widgets for the first time and the plot is refreshed.

Note: I have to use interactive_output because i want to change the layout. The problem doesn't occur when i use interact or interactive instead of interactive_output .

Here you can see an example code where this problem happens:

a = widgets.IntSlider(value=10)
b = widgets.IntSlider()
c = widgets.IntSlider()
ui = widgets.HBox([a, b, c])
def f(a, b, c):
    fig = go.Figure()
    fig.add_trace(go.Scatter(x=[a,b,c], y=[a,b,c],
                    mode='lines',
                    name='Shear'))
    fig.show()
    

out = widgets.interactive_output(f, {'a': a, 'b': b, 'c': c})
display(ui, out)

I want the plot to be displayed once I run the code without needing to interact with the widgets before. How can i solve this?

Thank you for your time.

Answer 1

Plotly or something is being weird right now. I'm seeing this work all the time in JupyterLab:

import plotly.graph_objects as go
import ipywidgets as widgets
a = widgets.IntSlider(value=10)
b = widgets.IntSlider(value=4)
c = widgets.IntSlider(value=4)

def f(a, b, c):
    fig = go.Figure()
    fig.add_trace(go.Scatter(x=[a,b,c], y=[a,b,c],
                    mode='lines',
                    name='Shear'))
    fig.show()

ui = widgets.HBox([a, b, c])
out = widgets.interactive_output(f, {'a': a, 'b': b, 'c': c})
display(ui, out)
a.value=5

Your code even works in JupyterLab in a new notebook with the import statements added. (Those import statements are the first two lines in what I posted.)

You can see it for yourself by going here , and opening a new notebook after the session spins up and paste in your code or mine and see it runs, without need for interacting with the sliders first.

However, most of the time in a new classic notebook in the very same session, it just doesn't ever show any plot, even after using sliders (???) . Yet occasionally in a new notebook, in the classic interface, the same code I provided does work. Or it works every time in the classic notebook when run after the previous code here . (You can even click the Voila button and the plot renders.) Yet it works every time in JupyterLab associated with that session. (From inside the session, you can get over to JupyterLab by click the Jupyter logo in the upper left in classic mode.)
I think something isn't get imported or initialized right in the classic notebook but it's escaping me what it is right now. And for some reason, pasted in the notebook here overcomes it. The weird thing is though that I don't even have to run the code in that notebook first. Just opening it, pasting in the code, and running that cell is enough for it to work consistently??. It is odd and not making sense.
I don't think it is needing to set the notebook to 'Trust' because I did recently get brand new notebooks in classic notebook interface mode to work with my code, just not consistently.
Compounding the oddness, your code is behaving like you said if pasted into the notebook that comes up from here , yet isn't showing when you open a new notebook from the same session in the classic interface.

---

---

Was hoping the plotly epxress version of that would be more robust; however, it didn't seem to be the case:

import plotly.express as px
import ipywidgets as widgets
a = widgets.IntSlider(value=10)
b = widgets.IntSlider(value=4)
c = widgets.IntSlider(value=4)

def f(a, b, c):
    # based on https://stackoverflow.com/questions/61358173/plotly-interactive-graph-with-linesmarkers-mode-using-plotly-express
    fig = px.line(x=[a,b,c], y=[a,b,c])
    fig.add_scatter(x=[a,b,c], y=[a,b,c],
                    mode='markers',
                    name='Shear')
    fig.show()

ui = widgets.HBox([a, b, c])
out = widgets.interactive_output(f, {'a': a, 'b': b, 'c': c})
display(ui, out)
a.value=5

Worked or didn't in same pattern.