Dash- Plotly null is not an object (evaluating 'figure.data')

Viewed 1453

Need some help here. Have a Flask app that is firing this error and have no clue how i can improve this. Any help is much appreciated! Seems that it is some error from the way how the plotly app is using react and rendering things into the DOM. What I am doing is saving some data into a DB and from the DB am creating a graph that shows an index that has to be rendered accordingly by the app into the DOM.

This is the entire error:

TypeError: null is not an object (evaluating 'figure.data')
plot — Graph.react.js:108
componentWillReceiveProps — Graph.react.js:230
Zf — react-dom@16.8.6.min.js:67:396
qg — react-dom@16.8.6.min.js:95:339
Qg — react-dom@16.8.6.min.js:144:296
Rg — react-dom@16.8.6.min.js:145:171
Sc — react-dom@16.8.6.min.js:158:112
Z — react-dom@16.8.6.min.js:156:495
Kc — react-dom@16.8.6.min.js:155
ya — react-dom@16.8.6.min.js:153:188
enqueueSetState — react-dom@16.8.6.min.js:202:412
setState — react@16.8.6.min.js:20:449
handleChange — connect.js:302
handleChange
dispatch — createStore.js:173
handleResponse — index.js:742
handleJson — index.js:913
promiseReactionJob

This is my python flask code

import dash
from dash.dependencies import Output, Input
#Event
import dash_core_components as dcc
import dash_html_components as html
import plotly
import random
import plotly.graph_objs as go
from collections import deque
import sqlite3
import pandas as pd
import time
#popular topics: google, olympics, trump, gun, usa

app = dash.Dash(__name__)
app.layout = html.Div(
    [   html.H2('Live Twitter Sentiment'),
        dcc.Input(id='sentiment_term', value='olympic', type='text'),
        dcc.Graph(id='live-graph', animate=False),
        dcc.Interval(
            id='graph-update',
            interval=1*1000
        ),

    ]
)

@app.callback(Output('live-graph', 'figure'),
              [Input(component_id='sentiment_term', component_property='value')],
            #   events=[Event('graph-update', 'interval')]
            )
def update_graph_scatter(sentiment_term):
    try:
        conn = sqlite3.connect('twitter.db')
        c = conn.cursor()
        df = pd.read_sql("SELECT * FROM sentiment WHERE tweet LIKE ? ORDER BY unix DESC LIMIT 200", conn ,params=('%' + sentiment_term + '%',))
        df.sort_values('unix', inplace=True)
        df['sentiment_smoothed'] = df['sentiment'].rolling(int(len(df)/2)).mean()

        df['date'] = pd.to_datetime(df['unix'],unit='ms')
        df.set_index('date', inplace=True)
        df = df.resample('1min').mean()
        df.dropna(inplace=True)
        X = df.index
        Y = df.sentiment_smoothed

        data = plotly.graph_objs.Scatter(
                x=X,
                y=Y,
                name='Scatter',
                mode= 'lines+markers'
                )

        return {'data': [data],'layout' : go.Layout(xaxis=dict(range=[min(X),max(X)]),
                                                    yaxis=dict(range=[min(Y),max(Y)]),
                                                    title='Term: {}'.format(sentiment_term))}

    except Exception as e:
        with open('errors.txt','a') as f:
            f.write(str(e))
            f.write('\n')

if __name__ == '__main__':
    app.run_server(debug=True)
1 Answers

I substituted a dummy dataframe, since I don't have access to your database. The code runs and displays the graph correctly with my dataframe, so I strongly suspect there is something going awry with the ETL code.

Your error message is reporting that the data section of the figure prop is null, which also makes me think something has gone wrong with the ETL process. Try checking the contents of each step along the way and see if, at some point, you end up with a None value somewhere.

Related