Description
Hey Plotly team!
I had just created an issue about images failing with the new FigureWidget. However, I've come to realize that the issue is more nuanced (and general) than previously noted and so thought I'd close that issue and open a new one.
An image can be added to an instance of a FigureWidget, but only to the first instance; an image cannot be added to a second. The same goes for heatmaps. Slightly different behavior, though still unexpected, is observed for bars. I suspect this erratic behavior is associated with the adoption of anywidget (PR #4823).
Consider the following examples (run from a classic jupyter notebook in Chrome):
Example 1a: successful addition of image to two FigureWidget instances (expected behavior, pre-anywidget)
plotly v5.24.1
anywidget not installed
notebook v7.3.1
run the cell below twice
import plotly.graph_objects as go
fig = go.FigureWidget()
# Add an image to the figure
fig.add_layout_image(
dict(
source="https://raw.githubusercontent.com/cldougl/plot_images/add_r_img/vox.png",
xref="x",
yref="y",
x=1,
y=1,
sizex=1,
sizey=1,
xanchor="center",
yanchor="middle"
)
)
fig.show()first output:
second output:
Example 1b: unsuccessful addition of image to two FigureWidget instances (unexpected behavior, post-anywidget)
plotly v6.0.0rc0
anywidget v0.9.13
notebook v7.3.1
run the cell below twice
import plotly.graph_objects as go
fig = go.FigureWidget()
# Add an image to the figure
fig.add_layout_image(
dict(
source="https://raw.githubusercontent.com/cldougl/plot_images/add_r_img/vox.png",
xref="x",
yref="y",
x=1,
y=1,
sizex=1,
sizey=1,
xanchor="center",
yanchor="middle"
)
)
fig.show()first output:
second output:
Example 2a: successful addition of heatmap to two FigureWidget instances (expected behavior, pre-anywidget)
plotly v5.24.1
anywidget not installed
notebook v7.3.1
run the cell below twice
import plotly.graph_objects as go
fig1 = go.FigureWidget()
fig1.add_trace(go.Heatmap(
z=[[1, 20, 30],
[20, 1, 60],
[30, 60, 1]]))
fig1.show()first output:
second output:
Example 2b: unsuccessful addition of heatmap to two FigureWidget instances (unexpected behavior, post-anywidget)
plotly v6.0.0rc0
anywidget v0.9.13
notebook v7.3.1
run the cell below twice
import plotly.graph_objects as go
fig1 = go.FigureWidget()
fig1.add_trace(go.Heatmap(
z=[[1, 20, 30],
[20, 1, 60],
[30, 60, 1]]))
fig1.show()first output:
second output:
Example 3a: successful addition of bars to two FigureWidget instances (expected behavior, pre-anywidget)
plotly v5.24.1
anywidget not installed
notebook v7.3.1
run the cell below twice
import plotly.graph_objects as go
animals=['giraffes', 'orangutans', 'monkeys']
fig1 = go.FigureWidget([go.Bar(x=animals, y=[20, 14, 23])])
fig1.show()first output
second output
Example 3b: discrepancy in addition of bars to two FigureWidget instances (uexpected behavior, post-anywidget)
plotly v6.0.0rc0 (after anywidget added as dependency)
anywidget v0.9.13
notebook v7.3.1
run the cell below twice
import plotly.graph_objects as go
animals=['giraffes', 'orangutans', 'monkeys']
fig1 = go.FigureWidget([go.Bar(x=animals, y=[20, 14, 23])])
fig1.show()first output
second output
I suspect that, for an experienced Plotly developer, the change in the last example might be diagnostic (fingers crossed).
Of note, this issue doesn't arise when adding multiple datasets to the same FigureWidget instance; consider the following:
Example 4: (expected behavior, post-anywidget)
plotly v6.0.0rc0
anywidget v0.9.13
notebook v7.3.1
cell 1
import plotly.graph_objects as go
fig = go.FigureWidget()
# Add an image to the figure
fig.add_layout_image(
dict(
source="https://raw.githubusercontent.com/cldougl/plot_images/add_r_img/vox.png",
xref="x",
yref="y",
x=1,
y=1,
sizex=1,
sizey=1,
xanchor="center",
yanchor="middle"
)
)
fig.show()cell 2
fig.add_trace(go.Heatmap(
z=[[1, 20, 30],
[20, 1, 60],
[30, 60, 1]]))
fig.show()cell 3
# Add an image to the figure
fig.add_layout_image(
dict(
source="https://images.plot.ly/language-icons/api-home/python-logo.png",
xref="x",
yref="y",
x=2,
y=2,
sizex=1,
sizey=1,
xanchor="center",
yanchor="middle"
)
)
fig.show()
Any ideas on why having multiple FigureWidget instances would cause such erratic behavior following the adoption of anywidget?
This is the official end of the issue, but I had gone through some additional examples and have included them below in case they're of use:
Example 5a: successful addition of image to both FigureWidget instances (expected behavior, pre-anywidget)
plotly v5.24.1
anywidget not installed
notebook v7.3.1
cell 1
import plotly.graph_objects as go
# Create a Plotly figure
fig1 = go.FigureWidget()
# Add an image to the figure
fig1.add_layout_image(
dict(
source="https://raw.githubusercontent.com/cldougl/plot_images/add_r_img/vox.png",
xref="x",
yref="y",
x=1,
y=1,
sizex=1,
sizey=1,
xanchor="center",
yanchor="middle"
)
)
fig1.show()
cell 2
# Create a Plotly figure
fig2 = go.FigureWidget()
# Add an image to the figure
fig2.add_layout_image(
dict(
source="https://images.plot.ly/language-icons/api-home/python-logo.png",
xref="x",
yref="y",
x=1,
y=1,
sizex=1,
sizey=1,
xanchor="center",
yanchor="middle"
)
)
fig2.show()
Example 5b: unsuccessful addition of image to first FigureWidget instance but not second (unexpected behavior, post-anywidget)
plotly v6.0.0rc0
anywidget v0.9.13
notebook v7.3.1
cell 1
import plotly.graph_objects as go
fig1 = go.FigureWidget()
# Add an image to the figure
fig1.add_layout_image(
dict(
source="https://raw.githubusercontent.com/cldougl/plot_images/add_r_img/vox.png",
xref="x",
yref="y",
x=1,
y=1,
sizex=1,
sizey=1,
xanchor="center",
yanchor="middle"
)
)
fig1.show()
cell 2
# Create a Plotly figure
fig2 = go.FigureWidget()
# Add an image to the figure
fig2.add_layout_image(
dict(
source="https://images.plot.ly/language-icons/api-home/python-logo.png",
xref="x",
yref="y",
x=1,
y=1,
sizex=1,
sizey=1,
xanchor="center",
yanchor="middle"
)
)
fig2.show()
Example 6a: successful addition of image to second FigureWidget instance regardless of data added to first FigureWidget instance (expected behavior, pre-anywidget)
plotly v5.24.1
anywidget not installed
notebook v7.3.1
cell 1
import plotly.graph_objects as go
fig1 = go.FigureWidget(data=go.Heatmap(
z=[[1, 20, 30],
[20, 1, 60],
[30, 60, 1]]))
fig1.show()
cell 2
import plotly.graph_objects as go
# Create a Plotly figure
fig2 = go.FigureWidget()
# Add an image to the figure
fig2.add_layout_image(
dict(
source="https://raw.githubusercontent.com/cldougl/plot_images/add_r_img/vox.png",
xref="x",
yref="y",
x=1,
y=1,
sizex=1,
sizey=1,
xanchor="center",
yanchor="middle"
)
)
fig2.show()
Example 6b: unsuccessful addition of image to second FigureWidget instance regardless of data added to first FigureWidget instance (unexpected behavior, post-anywidget)
plotly v6.0.0rc0
anywidget v0.9.13
notebook v7.3.1
cell 1
import plotly.graph_objects as go
fig1 = go.FigureWidget(data=go.Heatmap(
z=[[1, 20, 30],
[20, 1, 60],
[30, 60, 1]]))
fig1.show()
cell 2
# import plotly.graph_objects as go
fig2 = go.FigureWidget()
# Add an image to the figure
fig2.add_layout_image(
dict(
source="https://raw.githubusercontent.com/cldougl/plot_images/add_r_img/vox.png",
xref="x",
yref="y",
x=1,
y=1,
sizex=1,
sizey=1,
xanchor="center",
yanchor="middle"
)
)
fig2.show()