incorrect item toggle behavior when using multiple legends #6886
Description
I’m facing an issue with Plotly where I’m trying to create a figure with two legends, each requiring different behavior. The first legend should have ‘toggle’ item behavior, allowing individual traces to be toggled on and off. The second legend should have ‘togglegroup’ item behavior, enabling the toggling of entire legend groups.
Problem:
The problem I’m encountering is that the second legend is inheriting the clicking behavior of the first legend, regardless of the configurations I’ve attempted (group / item).
Reproducible Example:
import plotly.express as px
import plotly.graph_objects as go
import numpy as np
np.random.seed(42)
x = np.random.rand(100)
y1 = np.random.rand(100)
y2 = np.random.rand(100)
fig = go.Figure()
# Traces
fig.add_trace(go.Scatter(x=x, y=y1, mode='markers'))
fig.add_trace(go.Scatter(x=x, y=y2, mode='markers'))
# Shapes
fig.add_shape(type="circle", x0=0.2, y0=0.2, x1=0.4, y1=0.4, xref="x", yref="y", line=dict(color="red"), opacity=0.5, name='Shape1', legendgroup='Group1', legend='legend2', showlegend=True)
fig.add_shape(type="circle", x0=0.6, y0=0.6, x1=0.8, y1=0.8, xref="x", yref="y", line=dict(color="blue"), opacity=0.5, name='Shape2', legendgroup='Group2', legend='legend2', showlegend=True)
# Customize layout
fig.update_layout(legend=dict(itemclick=False), legend2=dict(yanchor="top", y=1.2, xanchor="left", x=0.01, itemclick='toggle'))
# Show the figure
fig.show('browser')
In the example above, I disabled the first legend itemclick behavior and set the second one to ‘toggle’ (regardless to the group). Unfortunately, both legends itemclick is disabled. 😦
Tested with latest Plotly version 5.18 (Plotly.js version is v2.27.0)