# The plotly dash

**URL:** <https://community.plotly.com/t/the-plotly-dash/55388>\
**Category:** Dash Python\
**Created:** [August 8, 2021, 10:51am UTC](https://community.plotly.com/t/the-plotly-dash/55388 "2021-08-08T10:51:43Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Nidhi](https://avatars.discourse-cdn.com/v4/letter/n/a5b964/32.png) [@Nidhi](https://community.plotly.com/u/Nidhi)\
**Post date:** [August 8, 2021, 10:51am UTC](https://community.plotly.com/t/the-plotly-dash/55388/1 "2021-08-08T10:51:43Z")

</div>

import dash  
import dash\_core\_components as dcc  
import dash\_html\_components as html  
import plotly.express as px  
import pandas as pd  
from dash.dependencies import Input, Output, State

df = pd.read\_csv(‘E:\Epicenter\Project 1\Final Notupdated.csv’)  
df = df.dropna()

app = dash.Dash( **name** )

app.layout = html.Div(  
children = [  
dcc.Dropdown(id = ‘my\_dropdown’, multi = False,  
options=[{‘label’ : “Support”, ‘value’ : “Support”},  
{‘label’ : “Domestic”, ‘value’ : “Domestic”},  
{‘label’ : “International”, ‘value’ : “International”}]),  
dcc.Graph(id = ‘graph-output’, figure = {})  
]  
)

@app.callback(  
Output(component\_id = ‘graph-output’, component\_property = ‘figure’),  
[Input(component\_id = ‘my\_dropdown’, component\_property = ‘value’)],  
prevent\_initial\_call=False  
)

def update\_my\_graph(val\_chosen):  
print(f"value user chose: {val\_chosen}")  
print(type(val\_chosen))  
#dff = df[df[“Group”].isin(val\_chosen)]  
fig = px.scatter(df, x=“RAG\_Status”, y=“Score”,color=df[“RAG Status”], hover\_name=“Employee Name”)  
return fig

if **name** == ‘ **main** ’:  
app.run\_server(debug=True)

---

<div class="post-metadata">

**Author:** ![atharvakatre](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/atharvakatre/32/14713_2.png) [@atharvakatre](https://community.plotly.com/u/atharvakatre)\
**Post date:** [August 8, 2021, 1:14pm UTC](https://community.plotly.com/t/the-plotly-dash/55388/2 "2021-08-08T13:14:51Z")

</div>

Hello @Nidhi and welcome to the dash community!

> [@Nidhi](#):
>
> #dff = df[df[“Group”].isin(val\_chosen)]

Seems like this line filters the original df with the dropdown input, why is it commented?  
And you are using the original `df` in your `px.scatter()` instead of `dff` which is filtered. As there is no filtered or new data being passed your graph figure will stay the same.

Another tip for you, while pasting your code on the forum make sure to click the code icon of the editor so that your code is formatted well with the correct indents.

 ![image](https://us1.discourse-cdn.com/flex024/uploads/plot/original/2X/f/f162dfe942cb2830cbd4525f1f1e732f9d9ce884.png)

---

<div class="post-metadata">

**Author:** ![atharvakatre](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/atharvakatre/32/14713_2.png) [@atharvakatre](https://community.plotly.com/u/atharvakatre)\
**Post date:** [August 9, 2021, 6:18am UTC](https://community.plotly.com/t/the-plotly-dash/55388/4 "2021-08-09T06:18:43Z")

</div>

@Nidhi

When your app is first loaded there is no value selected in your dropdown which means NoneType value gets passed in your callback function initially, which causes the pandas error for NoneType.

You can tackle this by either:

1. Setting some default values for your dropdown by using `value` parameter in the `dcc.Dropdown` component.
2. If you don’t default selected values for your dropdown on initial load you can prevent the first callback from firing by setting `prevent_initial_call=True`.