Argthtjtr

Chart in dash shows long range of X-axis. And it doesn't autorange automatically.

app.layout = html.Div(

    [

        dcc.Graph(id='live-graph', animate=True),

        dcc.Interval(

            id='graph-update',

            interval=100

        ),

    ]

)



@app.callback(Output('live-graph', 'figure'),

              events=[Event('graph-update', 'interval')])

def update_graph_scatter():

        df = market_collection['coinbase']['BTC-USD']



        data = plotly.graph_objs.Scatter(

                x=list(df.index),

                y=list(df.price),

                name='Scatter',

                mode='lines+markers'

                )

        return {'data': [data], 'layout': go.Layout(xaxis=dict(range=[min(df.index),

                                                                      max(df.index)]),

                                                    yaxis=dict(range=[min(df.price),

                                                                      max(df.price)]),)}

Every 100ms it refreshes and graph starts from 2000's year for some time, that is not more than 10ms. After that it starts from df.index[0] until next refresh. Next picture shows it.

Even after refresh, it doesn't autoscale.

Head of df:

index | price | volume

2018-11-17 15:05:19.142000+00:00 | 5492.15 | 0.008877

2018-11-17 15:05:32.872000+00:00 | 5491.66 | 0.040914

2018-11-17 15:05:33.710000+00:00 | 5491.63 | 0.005437

2018-11-17 15:05:36.745000+00:00 | 5491.64 | 0.003354

2018-11-17 15:05:38.810000+00:00 | 5491.64 | 0.005075