Hi!!
I’d like to do something like this with two graphs in Dash.
I need to draw arrows and other symbols inside graphs.
Is possible??
Thank you so much!
Hi @Sampal you can combine the two graphs in one using subplots, and then use plotly shapes and annotations to add line, arrows, circles etc. See a basic example below
from plotly.subplots import make_subplots
import plotly.graph_objects as go
fig = make_subplots(1, 2)
fig.add_trace(go.Bar(x=[1, 2, 3], y=[1, 2, 3]), 1, 1)
fig.add_trace(go.Bar(x=[1, 2, 3], y=[1, 2, 4]), 1, 2)
fig.add_shape(
# Line reference to the plot
go.layout.Shape(
type="line",
xref="paper",
yref="y",
x0=0,
y0=1,
x1=1,
y1=1,
line=dict(
color="DarkOrange",
width=3,
),
),
)
fig.show()
Note that I’ve used a different reference for x (paper, that is all the graph without the outer margins) and for y (data coordinates). Some links for further information
- Shapes https://plot.ly/python/shapes/
- Annotations https://plot.ly/python/text-and-annotations/
- Subplots https://plot.ly/python/subplots/ (in particular if you want to share the y axis https://plot.ly/python/subplots/#subplots-with-shared-yaxes)
2 Likes
@Sampal Just use this sample:
html.P(['▲'], style={'color': 'green'})
OR
html.P(['▼'], style={'color': 'red'})