Graph on update on page refresh

Dash Python
1

Hi All, any guidance would be appreciated. I get the additional candlesticks but only when i refresh the whole page instead of them appearing every time n_internal fires? Below is pasted code. Would much appreciated any guidance.
Shad

import dash
from dash.dependencies import Input, Output
import dash_core_components as dcc
import dash_html_components as html
import pandas as pd

df_data_to_chart = pd.read_csv(r’C:\Users\shadm\PycharmProjects\ExchangeProj\XXRPZEUR_Crypto_Price.csv’)
crypto_ticker = df_data_to_chart.loc[0][‘Ticker’]

app = dash.Dash(name)
app.layout = html.Div(
[
dcc.Graph(id=‘live-graph’, animate=True),
dcc.Interval(id=‘interval-component’, interval=3000, n_intervals=0)
]
)

@app.callback(Output(‘live-graph’, ‘figure’),
[Input(‘interval-component’, ‘n_intervals’)])
def update_graph(n):
df = pd.read_csv(r’C:\Users\shadm\PycharmProjects\ExchangeProj\XXRPZEUR_Crypto_Price.csv’)
print(f"you’ve clicked {n} times")
print(‘this is df_index’, df.index)
return { ‘data’: [{
‘x’: df.index,
‘open’: df[‘Open’],
‘high’: df[‘High’],
‘low’: df[‘Low’],
‘close’: df[‘Close’],
‘type’: ‘candlestick’,
‘name’: crypto_ticker,
‘legendgroup’: crypto_ticker,
‘increasing’: {‘line’: {‘color’: ‘#17BECF’}},
‘decreasing’: {‘line’: {‘color’: ‘#808080’}}
}],
‘layout’: {
‘margin’: {‘b’: 0, ‘r’: 10, ‘l’: 60, ‘t’: 0},
‘legend’: {‘x’: 0},
‘yaxis’: {‘range’: [min(df[‘Low’]) - 0.1 * min(df[‘Low’]), max(df[‘High’]) + 0.1 * min(df[‘High’])]}
}
}

if name == ‘main’:
app.run_server(debug=False)

2

Solved the issue, very new to Dash hence learning on steep starting curve. Forgot to include the xaxis in the layout. Fixed as below.

}],
    'layout': {
        'margin': {'b': 0, 'r': 10, 'l': 60, 't': 0},
        'legend': {'x': 0},
        'xaxis': {'range': [min(df.index), max(df.index)]},
        'yaxis': {'range': [min(df['Low']) - 0.1 * min(df['Low']), max(df['High']) + 0.1 * min(df['High'])]}
    }
}