title: How do I make it so that the zoom on a plotly chart stays persistent even when new data loads?
body: <p>I have a chart that looks like this-</p>
  <pre><code>import datetime
  
  import dash
  from dash import dcc, html
  import plotly
  from dash.dependencies import Input, Output
  from pyorbital.orbital import Orbital
  satellite = Orbital('TERRA')
  
  app = dash.Dash(__name__, external_stylesheets=external_stylesheets)
  app.layout = html.Div(
      html.Div([
          html.H4('TERRA Satellite Live Feed'),
          html.Div(id='live-update-text'),
          dcc.Graph(id='live-update-graph'),
          dcc.Interval(
              id='interval-component',
              interval=10*1000, # in milliseconds
              n_intervals=0
          )
      ])
  )
  
  
  @app.callback(Output('live-update-text', 'children'),
                Input('interval-component', 'n_intervals'))
  def update_metrics(n):
      lon, lat, alt = satellite.get_lonlatalt(datetime.datetime.now())
      style = {'padding': '5px', 'fontSize': '16px'}
      return [
          html.Span('Longitude: {0:.2f}'.format(lon), style=style),
          html.Span('Latitude: {0:.2f}'.format(lat), style=style),
          html.Span('Altitude: {0:0.2f}'.format(alt), style=style)
      ]
  
  
  # Multiple components can update everytime interval gets fired.
  @app.callback(Output('live-update-graph', 'figure'),
                Input('interval-component', 'n_intervals'))
  def update_graph_live(n):
      satellite = Orbital('TERRA')
      data = {
          'time': [],
          'Latitude': [],
          'Longitude': [],
          'Altitude': []
      }
  
      # Collect some data
      for i in range(180):
          time = datetime.datetime.now() - datetime.timedelta(seconds=i*20)
          lon, lat, alt = satellite.get_lonlatalt(
              time
          )
          data['Longitude'].append(lon)
          data['Latitude'].append(lat)
          data['Altitude'].append(alt)
          data['time'].append(time)
  
      # Create the graph with subplots
      fig = plotly.tools.make_subplots(rows=2, cols=1, vertical_spacing=0.2)
      fig['layout']['margin'] = {
          'l': 30, 'r': 10, 'b': 30, 't': 10
      }
      fig['layout']['legend'] = {'x': 0, 'y': 1, 'xanchor': 'left'}
  
      fig.append_trace({
          'x': data['time'],
          'y': data['Altitude'],
          'name': 'Altitude',
          'mode': 'lines+markers',
          'type': 'scatter'
      }, 1, 1)
      fig.append_trace({
          'x': data['Longitude'],
          'y': data['Latitude'],
          'text': data['time'],
          'name': 'Longitude vs Latitude',
          'mode': 'lines+markers',
          'type': 'scatter'
      }, 2, 1)
  
      return fig
  
  
  if __name__ == '__main__':
      app.run_server(debug=True)
  </code></pre>
  <p>Right now, if I zoom into the chart to look at a specific section of data and then the data refreshes, I lose my zoom position. I want to make the zoom position persistent even as new data loads. Perhaps settings the update as a background update is the answer here.</p>