Sure, that’s what I had in mind:
from dash import Dash, html, dcc, Output, Input, Patch
import plotly.graph_objects as go
app = Dash(
__name__,
external_stylesheets=[
]
)
def create_shapes(*positions):
shapes = [
{'type': 'line',
'x0': pos,
'x1': pos,
'xref': 'x',
'y0': 0,
'y1': 1,
'yref': 'y domain'
}
for pos in positions
]
return shapes
app.layout = html.Div(
[
dcc.Graph(
id='graph',
figure=go.Figure(
go.Scatter(
x=[*range(20)],
y=[*range(20)],
mode='markers+lines'
)
)
),
]
)
@app.callback(
Output('graph', 'figure'),
Input('graph', 'hoverData'),
prevent_initial_call=True
)
def update(hoverData):
# get hover coordinate in x direction
x = hoverData['points'][0]['x']
patched = Patch()
# add vertical lines, in this case three
# the relative distance to the hover coordinate is hard coded (1 and 2)
patched['layout']['shapes'] = create_shapes(x, x + 1, x + 2)
return patched
if __name__ == '__main__':
app.run(debug=True)