Glitch in dash when plotting timseries data in realtime

plotly-dash-timeseries.py

import random
from datetime import datetime, timedelta

import dash
import dash_core_components as dcc
import dash_html_components as html
import plotly.graph_objs as go

import pandas as pd

df=pd.DataFrame([])

def run(quotes=[]):
    quoteMap = {}
    global c
    c = 0
    for quote in quotes:
        quoteMap[quote] = None

    app = dash.Dash()
    app.layout = html.Div([
        html.Div([
            html.H2('Sensor realtime',
                    style={'float': 'left',
                           }),
        ]),
        dcc.Dropdown(id='data-name',
                     options=[{'label': s, 'value': s}
                              for s in quoteMap.keys()],
                     value=list(quoteMap.keys()),
                     multi=True
                     ),
        html.Div(children=html.Div(id='graphs'), className='row'),
        dcc.Interval(
            id='graph-update',
            interval=1000),
    ], className="container", style={'width': '98%', 'margin-left': 10, 'margin-right': 10, 'max-width': 50000})

    @app.callback(
        dash.dependencies.Output('graphs', 'children'),
        [dash.dependencies.Input('data-name', 'value')],
        events=[dash.dependencies.Event('graph-update', 'interval')]
    )
    def update_graph(data_names):

        global df
        global c
        c = c + 1
        for s in quoteMap.keys():
            dfTemp=pd.DataFrame([[random.uniform(1.5, 1.9), random.uniform(1.5, 1.9)
                               ]],columns=['sensor','temperature'],index=[datetime.now() + timedelta(minutes=c)])
            df=df.append(dfTemp)
        print(df.head())
        graphs = []
        if len(data_names) > 2:
            class_choice = 'col s12 m6 l4'
        elif len(data_names) == 2:
            class_choice = 'col s12 m6 l6'
        else:
            class_choice = 'col s12'

        for data_name in data_names:

            trace = go.Scatter(
                x=df.index,
                y=df.sensor,
                mode='lines+markers',
                name='SENSOR'
            )

            trace2 = go.Scatter(
                x=df.index,
                y=df.temperature,
                mode='lines+markers',
                name='TEMPERATURE'
            )


            graphs.append(html.Div(dcc.Graph(
                id=data_name,
                animate=True,
                figure={'data': [trace, trace2], 'layout': go.Layout(
                    xaxis=dict(type='date',
                               tickformat='%H:%M:%S',
                               range=[df.index.min(), df.index.max()]),
                    yaxis=dict(range=[df['sensor'].min(), df['sensor'].max()]),
                    title=data_name)}
            ), className=class_choice))

        return graphs

    external_css = ["https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css"]
    for css in external_css:
        app.css.append_css({"external_url": css})

    external_js = ['https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js']
    for js in external_js:
        app.scripts.append_script({'external_url': js})

    app.run_server(debug=True)


run(['SENSOR'])