DASH Realtime candlestick chart dissapears when live updating yet its keeping the indicators

Viewed 380

Hey everyone i am making a DASH Realtime candlestick chart, and i have stumpled on an problem i hope you can help me with.

The problem is that when i run the project, it loads the candlestick chart fine and the indicators. But as soon as it updates by the interval it, then disapears, and it will do that on every update if i try to wing it back from the legends tab. Also the chart works fine, and updates fine if its alone, and without the indicators, but when they are added into the chart it removes the candlestick charts visability after 1 update.

The data is being pulled from a Websocket stream and converted into SQL, then into pandas dataframe.

This is an image of what happens:

enter image description here enter image description here

This is the code:

import dash
from dash.dependencies import Output, Input
from dash import dcc
from dash import html
import pandas as pd
import plotly.graph_objs as go
import flask
import waitress
from waitress import serve


server = flask.Flask(__name__) # define flask app.server

app = dash.Dash(__name__, server=server) # call flask server
    

app.layout = html.Div(
    html.Div([
        dcc.Graph(id='live-update-graph-scatter', animate=True),
        dcc.Interval(
            id='interval-component',
            disabled=False,
            interval=1*5000,
            n_intervals=0
        )
    ])
)

@app.callback(Output('live-update-graph-scatter', 'figure'),
              [Input('interval-component', 'n_intervals')])
def update_graph_scatter(n):


    rec = pd.read_sql_table('crypto', engine)
    rec1 = pd.DataFrame(rec)
    print(rec1)
    rec1.columns = ['date', 'open', 'high', 'low', 'close', 'volume', 'EMA', 'EMA2']

    rec1['date'] = pd.to_datetime(rec1['date'])
    rec1.set_index('date', inplace=True)

    ###SUBPLOT AND Candlestick CHART
    fig = make_subplots(rows=4, cols=1)

    fig.add_trace(go.Candlestick(
        x=rec1.index,
        open=rec1['open'],
        high=rec1['high'],
        low=rec1['low'],
        close=rec1['close']),
        row=1,
        col=1,
    )

    ###### ADD INDICATOR TRACES:
    fig.add_trace(
        go.Scatter(
            x=rec1.index,
            y=rec1['EMA'],
            marker=dict(color='blue')
        ),
        row=1,
        col=1
    )
    fig.add_trace(
        go.Scatter(
            x=rec1.index,
            y=rec1['EMA2'],
            marker=dict(color='red')
        ),
        row=1,
        col=1
    )



    return fig



if __name__ == '__main__':
    serve(app.server, host="localhost", port=5005)

Do you have any suggestions as to what i can do i would be happy to hear that.

Best regards.

Mathias

1 Answers

The solution is to look at the attribute animate in the graph object. https://dash.plotly.com/dash-core-components/graph

You have to specify the animation option, with redraw = True, otherwise it wont draw it out. Maybe if you dont want it to redraw you can make some appending function so only the current candle gets redrawn.

But my problem got fixed.

Related