title: How to trigger a mouseout event in Python Dash?
body: <p>How can I implement a callback function that reacts to <code>mouseout</code> and restores a default when not hovering over a data point?</p>
  <p>I simplified a code snipped from the 'Interactive Visualizations' section of the Plotly|Dash tutorial to illustrate my question. In this example a <code>callback</code> function returns the <code>mouseover</code> information. How do I return a default on <code>mouseout</code>?</p>
  <pre><code>import dash
  import dash_core_components as dcc
  import dash_html_components as html
  from dash.dependencies import Input, Output
  import plotly.express as px
  import pandas as pd
  
  app = dash.Dash(__name__)
  
  df = pd.DataFrame({
      &quot;x&quot;: [1,2,1,2],
      &quot;y&quot;: [1,2,3,4]
  })
  
  fig = px.scatter(df, x=&quot;x&quot;, y=&quot;y&quot;) 
  fig.update_traces(marker_size=20)
  
  app.layout = html.Div([
      dcc.Graph(
          id='basic-interactions',
          figure=fig
      ),
      html.Div([
          html.Pre(id='hover-data')
      ])
  ])
  
  @app.callback(
      Output('hover-data', 'children'),
      Input('basic-interactions', 'hoverData'))
  def display_hover_data(hoverData):
      if hoverData:
          return str(hoverData)
      else:
          return &quot;hover over data point&quot;
  
  if __name__ == '__main__':
      app.run_server(debug=True)
  </code></pre>