# Need help with making a Bar Chart using plotly Dash. Newbie here

**URL:** <https://community.plotly.com/t/need-help-with-making-a-bar-chart-using-plotly-dash-newbie-here/62909>\
**Category:** 📊 Plotly Python\
**Tags:** question\
**Created:** [April 11, 2022, 1:09am UTC](https://community.plotly.com/t/need-help-with-making-a-bar-chart-using-plotly-dash-newbie-here/62909 "2022-04-11T01:09:58Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Syraxx](https://avatars.discourse-cdn.com/v4/letter/s/c2a13f/32.png) [@Syraxx](https://community.plotly.com/u/Syraxx)\
**Post date:** [April 11, 2022, 1:09am UTC](https://community.plotly.com/t/need-help-with-making-a-bar-chart-using-plotly-dash-newbie-here/62909/1 "2022-04-11T01:09:58Z")

</div>

So i’m looking to make an interactive barchart with a dropdown menu per asset which i will have in my dataframe. Here is a snippet of what my data frame looks like.

 ![image](https://us1.discourse-cdn.com/flex024/uploads/plot/original/3X/7/4/74dae4eb5b524f406b5c743c425a72a33d5eb28a.png)

Here is the code i’m using to make tehe dashboard, it gives me no error and at the same time does not populate the graph with any data. Any help, or a different soultion would be highly regarded.

dff = df2

# ======================== Dash App

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

# ======================== App Layout

app.layout = html.Div([  
html.H1(‘Asset Dashboard’, id=‘title’, style={‘color’: ‘#351e15’, ‘text-align’: ‘center’,  
‘margin-top’: ‘20px’}),  
dcc.Dropdown(  
id=‘Asset\_ID’,  
options=[  
{‘label’: ‘ML01 - MILL’, ‘value’: ‘ML01 - MILL’},  
{‘label’: ‘ML01 - PINION SHAFT’, ‘value’: ‘ML01 - PINION SHAFT’},  
],  
value=‘ML01 - MILL’,  
style={‘width’: ‘50%’, ‘margin’: ‘20px auto 0px auto’}  
),  
dcc.Graph(id=‘bar-graph’, style={‘height’: ‘425px’})  
])  
@app.callback(Output(‘bar-graph’, ‘figure’), Input(‘inp’, ‘value’))  
def get\_graph(inp):

```
figure = go.Figure().add_trace(go.Bar(x=dff['Report Date'],
                                          y=dff['ConditionCode'],
                                          name='Performance Graph',
                                          marker=dict(color='#351e15')))
return figure

```

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

---

<div class="post-metadata">

**Author:** ![Syraxx](https://avatars.discourse-cdn.com/v4/letter/s/c2a13f/32.png) [@Syraxx](https://community.plotly.com/u/Syraxx)\
**Post date:** [April 11, 2022, 5:53am UTC](https://community.plotly.com/t/need-help-with-making-a-bar-chart-using-plotly-dash-newbie-here/62909/2 "2022-04-11T05:53:09Z")

</div>

I want to make a bargraph with Report Date on x axis and Condition code on y axis ( changes color based of the color code )

---

<div class="post-metadata">

**Author:** ![jlfsjunior](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/jlfsjunior/32/16061_2.png) [@jlfsjunior](https://community.plotly.com/u/jlfsjunior)\
**Post date:** [April 14, 2022, 9:04am UTC](https://community.plotly.com/t/need-help-with-making-a-bar-chart-using-plotly-dash-newbie-here/62909/3 "2022-04-14T09:04:26Z")

</div>

Hi,

Welcome to the community!

The reason why the figure is empty is because the method `add_trace` does not return anything. So this should “work”:

```nohighlight
figure = go.Figure()

figure.add_trace(go.Bar(x=dff['Report Date'],
                                          y=dff['ConditionCode'],
                                          name='Performance Graph',
                                          marker=dict(color='#351e15')))

```

You would still need to filter `ddf` for a given asset id, and something like `ddf.query("Asset_ID == @inp" ` in the callback will do the job.

One last bit: if you want all ids available in the dropdown without hardcoding them, use this as options:

```nohighlight
options=[{"label: val, "value": val} for val in ddf["Asset_ID"].unique()]

```