Unable to open a Plotly image

JupyterLab
1

Hi all. I am trying to plot an image in Jupyterlab via Plotly.

import plotly.io as pio
# pio.renderers.default = 'notebook_connected'
pio.renderers.default = 'iframe'
plotly.express.scatter(x=embedding[:,0], 
                       y=embedding[:,1], 
                       template="simple_white", 
                       hover_name=[(...)],
                       color = [str(m) for m in metadata]])

I get the following error:

404 : Not Found

You are requesting a page that does not exist!

Can someone help me to resolve this problem?

I am using Jupyterlab through the most recent Docker image hosted at quay.io/jupyter/base-notebook, and using all the packages installed on that platform. I am accessing the server from a Windows machine through Firefox.

I am using the most recent version of plotly and ipywidgets on PyPI.

Please ask me for more information that seems relevant! I am not sure what is appropriate or useful to post, but I will gladly supply additional context.

2

Usually you want your code to be a minimal reproducible example. In this case it isn’t even syntactically correct and gives a syntax error even if I remove the incomplete line hover_name=[(...)],.

To give us more of a basis to discuss what is not happening for you…if I go here and launch a session where Ploty is installed via the launch binder badge I currently get Plotly version 5.24.1 running in JupyterLab 4.2.5 presently.

And run the following example that Google Gemini gave me for Plotly pio:

import plotly.io as pio
import plotly.graph_objects as go

# Create a figure
fig = go.Figure(data=[go.Bar(y=[2, 1, 3])], layout_title_text="A Figure Displayed with pio.show()")

# Display the figure using pio.show()
pio.show(fig)

I got a plot.

If I right-click on the text ‘A Figure Displayed with pio.show()’ in the output area, I see JupyterLab’s context dependent menu come up.

You seem to want to do something with pio.renderers, yet don’t mention that in the text of the post or title (see section below)?

If I run the following as spelled out here:

import plotly.io as pio
pio.renderers

I don’t see iframe as choice in what comes up from running that. I saw 'iframe_connected'. So first I’ll tried to use that. (Then later I read more about just ‘iframe’ there and it worked the similar as 'iframe_connected', in this test, with the HTML being more with ‘iframe’ so that it is more self-contained.)

Now when I restart the kernel and run the following, I get something slightly different:

import plotly.io as pio
pio.renderers.default = 'iframe_connected' #'iframe' works, too. See above.
import plotly.io as pio
import plotly.graph_objects as go

# Create a figure
fig = go.Figure(data=[go.Bar(y=[2, 1, 3])], layout_title_text="A Figure Displayed with pio.show()")

# Display the figure using pio.show()
pio.show(fig)

I get a plot that looks a bit bigger (taller) than the one I first got and I note that the behavior is different.
I can right-click on the text ‘A Figure Displayed with pio.show()’ in the output area and now I get a different menu and it has the option ‘This Frame’ with more sub options, such as ‘Open Frame in New Window’ and when choose that it gives me a new window showing the plot filling it. If back in JupyterLab, I right-click on the title text and choose ‘This Frame’ > ‘View Frame Source’ it seems to show HTML that indicates I am seeing an iframe.

I am using Firefox on my Mac.

The title and the first line are confusing? An ‘image’ or a plot figure? Images usually mean binary image buffer or file of defined formats or like a raster. I think you mean Plotly figure objects/plots?

2 Likes
3

Hi, thank you for this response.

Yes, it is not a complete reproducible example.
Some reproducible code to display the problem is:

import os
os.chdir("/home/jovyan/tutorial4/") # Choose a directory that exists
import plotly.io as pio

import numpy as np
import plotly.express
x=np.linspace(1,10)
y=np.linspace(1,10)

pio.renderers.default = 'iframe'
plotly.express.scatter(x=x,y=y, color = [str(m) for m in x])

It seems clear that the change to a new working directory is the issue.
I’m not sure there’s a way to tell Jupyter or Plotly where to look for the images if the os directory is changed. I don’t really need to change the os dir, though,
it’s just a convenience thing to make it easier to access files in the given directory, so this isn’t a huge blocker for me.

Your comment about pio.renderers is helpful. I thought that the variable was a constant and renderers would be the same across platforms. My variable shows:

        ['plotly_mimetype', 'jupyterlab', 'nteract', 'vscode',
         'notebook', 'notebook_connected', 'kaggle', 'azure', 'colab',
         'cocalc', 'databricks', 'json', 'png', 'jpeg', 'jpg', 'svg',
         'pdf', 'browser', 'firefox', 'chrome', 'chromium', 'iframe',
         'iframe_connected', 'sphinx_gallery', 'sphinx_gallery_png']

In particular, since iframe appears on that documentation page as a standard built-in renderer in the documentation you linked, it’s surprising that it’s not present in your version. My code worked before updating to more recent versions of Plotly, so maybe that renderer is no longer present and they have not updated the documentation. Otherwise, I am not sure why you don’t have iframe installed or how you should install it.

When I change it from iframe to notebook it seems to work.

You seem to want to do something with pio.renderers, yet don’t mention that in the text of the post or title (see section below)?

I am creating a documentation website and I intend to use nbconvert to convert my Jupyter notebook into HTML. I seem to remember that the default Plotly renderer stores the plots in a place that the nbconvert tool doesn’t see/can’t find, and so the HTML page has a blank space where the plot should be, so I was trying to find a renderer which would embed the plot directly into the notebook.

The title is confusing.

Sorry, I meant figure. But a plot is of course a kind of image :laughing:

1 Like
4

It isn’t a big deal that only ‘iframe_connected’ showed in my list because where I was discussing ‘iframe’ still worked & contrasted in the way it should relative to what ‘iframe_connected’ generated. Maybe that fact got buried in my text. And the current Plotly documentation definitely talks about the two if you look further in their document.

Does this mean your issue was solved?
Your documenting route works?