Dash Doesn't Show Plotly Line graph

[ardodul7]

I was trying to create a line graph in Dash. It is returning an empty graph with a tick mark and axis.
I created the same graph only in plotly. it works fine.
Please help me to figure out what am I doing wrong

Here’s what I want:

but this is what I end up getting:

Here’s a screenshot of the data:

And here’s my code:

import dash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output, State
import plotly.graph_objs as go
import pandas as pd

#create dataframe

data_line_current = pd.read_csv(‘AR_LINE_CUR.csv’)
#print (data_line_current.head())

app= dash.Dash()

app.layout = html.Div(
[
#graph start
dcc.Graph(id=‘graph’),
#graph start

                    ]
                 )

@app.callback(
Output(‘graph’,‘figure’)
)

def update_figure():
#filter data_line_current to only selected date

traces = []

for meter_no in filtered_df[u’meter_no’].unique():

df_by_meter = filtered_df[filtered_df[u’meter_no’]==meter_no]

traces.append(go.Scatter
              (
               x=data_line_current['cur_reading_time'],
               y=data_line_current['Avg_Line_Current'],
               mode='lines'
               #name=meter_no,
               )
            )

return {
        'data':traces ,
        'layout':go.Layout(
                          title = 'My Plot',
                          xaxis = {'title':'Reading Date & Time'},
                          yaxis = {'title':'Avg Line Current'}
                          )
        
        }

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

[adamschroeder]

@ardodul7 ,
You don’t need a callback when you are not tying a Dash component (dropdown, checkbox, slider, etc.) to a graph.

If you are just trying to plot a line graph in Dash, then do this:

data_line_current = pd.read_csv('AR_LINE_CUR.csv')

fig=go.Figure(data=go.Scatter(
                   x=data_line_current['cur_reading_time'],
                   y=data_line_current['Avg_Line_Current'],
                   mode='lines'
                   ))

app= dash.Dash()

app.layout = html.Div(
                        [
                         dcc.Graph(figure=fig),
                        ]
                     )

if __name__=='__main__':
    app.run_server()```

[ardodul7]

Hello Adam,
Thank you for your guidance.
I managed to add all the four columns in the same figure using trace and able to display it on using dash.

my next step would be to add a drop down for meter_no and a date range picker for the line chart.
I’ll look into your videos and try to learn it. If I get stuck, I might bother you again

-Ahsanur

[adamschroeder]

No worries. Good luck