✊🏿 Black Lives Matter. Please consider donating to Black Girls Code today.
⚡️ Concerned about the grid? Kyle Baranko teaches how to predicting peak loads using XGBoost. Register for the August webinar!

Ploting two graphs with one dropdown error Plotly - Dash - Pandas

[

Ploting two graphs with one dropdown error]

I am using the following csv file to analyze various project by regular and overtime hours

Date,Project,Regular Hours,Overtime Hours

7/5/2020,P1,955.52,386.42

7/5/2020,P2,235.73,4.42

7/5/2020,P3,421.64,177.72

7/12/2020,P1,2119.7,374.7

7/12/2020,P2,P2,83,16.89

7/12/2020,P3,1058.16,172.38

This data is for a calendar year by week, by project

The following code has a one dropdown to controls two separate graphs one for Regular Hours worked by Project and one for Overtime Hours by the same Projects.

Not quite sure what is causing the exception or how to fix it.

Any help is greatly appreciated.

The following code works in Dash but I am also getting exceptions which follows the Code below:

import pandas as pd
import plotly.express as px
import dash
import dash_core_components as dcc
import dash_html_components as html

df = pd.read_csv(r’C:/Time_Series_Study/Overtime2.csv’, delimiter = ‘,’, engine=‘python’)
df[‘Date’]=pd.to_datetime(df[‘Date’])
df.sort_values(by=[‘Date’], inplace=True, ascending=False)
MyProjects = df[‘Project’].unique()

app = dash.Dash()
app.layout = html.Div([
dcc.Dropdown(
id=‘demo-dropdown’,
options=[{‘label’: k, ‘value’: k} for k in MyProjects],
value=[‘11’],
multi=False
),

html.Hr(),
dcc.Graph(id='graph1',),
html.Hr(),
dcc.Graph(id='graph2',
        )

])

@app.callback(
dash.dependencies.Output(‘graph1’, ‘figure’),
[dash.dependencies.Input(‘demo-dropdown’, ‘value’)])

def update_output(value):
ts = df[df[‘Project’].isin([value])]
ts1 = ts.groupby([‘Date’, ‘Project’])[[‘Regular Hours’]].sum().reset_index()
fig = px.line(ts1, x=“Date”, y=“Regular Hours”, color=‘Project’)
return fig

@app.callback(
dash.dependencies.Output(‘graph2’, ‘figure’),
[dash.dependencies.Input(‘demo-dropdown’, ‘value’)])

def update_output(value):
ts2 = df[df[‘Project’].isin([value])]
ts3 = ts2.groupby([‘Date’, ‘Project’])[[‘Overtime Hours’]].sum().reset_index()
fig2 = px.line(ts3, x=“Date”, y=“Overtime Hours”, color=‘Project’)
return fig2

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

The following is the exception produced when Dash runs:

 * Serving Flask app "__main__" (lazy loading)
 * Environment: production
   WARNING: This is a development server. Do not use it in a production deployment.
   Use a production WSGI server instead.
 * Debug mode: off



 200 -
Exception on /_dash-update-component [POST]
Traceback (most recent call last):
  File "C:\Anaconda3\lib\site-packages\flask\app.py", line 2447, in wsgi_app
    response = self.full_dispatch_request()
  File "C:\Anaconda3\lib\site-packages\flask\app.py", line 1952, in full_dispatch_request
    rv = self.handle_user_exception(e)
  File "C:\Anaconda3\lib\site-packages\flask\app.py", line 1821, in handle_user_exception
    reraise(exc_type, exc_value, tb)
  File "C:\Anaconda3\lib\site-packages\flask\_compat.py", line 39, in reraise
    raise value
  File "C:\Anaconda3\lib\site-packages\flask\app.py", line 1950, in full_dispatch_request
    rv = self.dispatch_request()
  File "C:\Anaconda3\lib\site-packages\flask\app.py", line 1936, in dispatch_request
    return self.view_functions[rule.endpoint](**req.view_args)
  File "C:\Anaconda3\lib\site-packages\dash\dash.py", line 1076, in dispatch
    response.set_data(func(*args, outputs_list=outputs_list))
  File "C:\Anaconda3\lib\site-packages\dash\dash.py", line 1007, in add_context
    output_value = func(*args, **kwargs)  # %% callback invoked %%
  File "<ipython-input-1-4d0f23fb9c6a>", line 48, in update_output
    fig2 = px.line(ts3, x="Date", y="Overtime Hours", color='Project')
  File "C:\Anaconda3\lib\site-packages\plotly\express\_chart_types.py", line 252, in line
    return make_figure(args=locals(), constructor=go.Scatter)
  File "C:\Anaconda3\lib\site-packages\plotly\express\_core.py", line 1854, in make_figure
    for val in sorted_group_values[m.grouper]:
KeyError: 'Project'
127.0.0.1 - - [08/Nov/2020 17:00:23] "POST /_dash-update-component HTTP/1.1" 500 -
Exception on /_dash-update-component [POST]
Traceback (most recent call last):
  File "C:\Anaconda3\lib\site-packages\flask\app.py", line 2447, in wsgi_app
    response = self.full_dispatch_request()
  File "C:\Anaconda3\lib\site-packages\flask\app.py", line 1952, in full_dispatch_request
    rv = self.handle_user_exception(e)
  File "C:\Anaconda3\lib\site-packages\flask\app.py", line 1821, in handle_user_exception
    reraise(exc_type, exc_value, tb)
  File "C:\Anaconda3\lib\site-packages\flask\_compat.py", line 39, in reraise
    raise value
  File "C:\Anaconda3\lib\site-packages\flask\app.py", line 1950, in full_dispatch_request
    rv = self.dispatch_request()
  File "C:\Anaconda3\lib\site-packages\flask\app.py", line 1936, in dispatch_request
    return self.view_functions[rule.endpoint](**req.view_args)
  File "C:\Anaconda3\lib\site-packages\dash\dash.py", line 1076, in dispatch
    response.set_data(func(*args, outputs_list=outputs_list))
  File "C:\Anaconda3\lib\site-packages\dash\dash.py", line 1007, in add_context
    output_value = func(*args, **kwargs)  # %% callback invoked %%
  File "<ipython-input-1-4d0f23fb9c6a>", line 38, in update_output
    fig = px.line(ts1, x="Date", y="Regular Hours", color='Project')
  File "C:\Anaconda3\lib\site-packages\plotly\express\_chart_types.py", line 252, in line
    return make_figure(args=locals(), constructor=go.Scatter)
  File "C:\Anaconda3\lib\site-packages\plotly\express\_core.py", line 1854, in make_figure
    for val in sorted_group_values[m.grouper]:
KeyError: 'Project'

`