from dash import Dash, dcc, html, Input, Output, no_update, callback, ctx
import plotly.express as px
fig = px.scatter(x=[1, 2, 3], y=[1, 2, 1], text=["A", "B", "C"])
fig.update_traces(hoverinfo="none", hovertemplate=None, marker=dict(size=40))
fig.update_traces(textfont_color="white")
app = Dash(__name__)
app.layout = html.Div(
 [
 html.H3("Tooltip button callback output"),
 html.Div("No tooltip button clicked yet", id="out"),
 dcc.Graph(id="graph", figure=fig, clear_on_unhover=True),
 dcc.Tooltip(
 id="tooltip",
 targetable=True,
 children=html.Button(id="hover-click", children="Click me!"),
 ),
 ],
 style={"margin": "20px"},
)
# adapted from https://dash.plotly.com/dash-core-components/tooltip#styling-tooltip-with-background-and-border-color
@callback(
 Output("tooltip", "show"),
 Output("tooltip", "bbox"),
 Input("graph", "hoverData"),
 Input("hover-click", "n_clicks"),
)
def update_tooltip_content(hoverData, clicks):
 # close the tooltip when the button is clicked
 if ctx.triggered_id == "hover-click":
 return False, no_update
 # keep the tooltip open if we move away from the point, until we hover over another point
 if hoverData is None:
 return no_update, no_update
 pt = hoverData["points"][0]
 bbox = pt["bbox"]
 return True, bbox
@callback(
 Output("out", "children"),
 Input("hover-click", "n_clicks"),
 prevent_initial_call=True,
)
def save_changes(clicks):
 return f"Button has been clicked {clicks} times!"
if __name__ == "__main__":
 app.run(debug=True)