Stacked Bar Charts in Dash

Dash Python
1

Hello,

I am new to Dash, but not new to Plotly. I want to take stacked bar charts I created in an IPython Notebook and recreate them in a single page Dash app. Unfortunately, it looks like it doesn’t quite translate. Has anyone had success in creating a stacked bar chart in Dash, and if so, do you have an example?

Below is my current chart from IPython:

x=[‘January’, ‘February’, ‘March’, ‘April’,‘May’,‘June’,‘July’,‘August’,‘September’,]

trace1 = plotly.graph_objs.Bar(
x=x,
y=[6,16,15,20,11,22,13,13,11],
name=‘Client 1’,
marker=Marker(color=’#e4b0ae’)
)
trace2 = plotly.graph_objs.Bar(
x=x,
y=[0,0,0,0,0,0,0,4,0],
name=‘Client 2’,
marker=Marker(color=’#c4e5b0’)
)
trace3 = plotly.graph_objs.Bar(
x=x,
y=[0,0,0,0,0,0,0,0,1],
name=‘Client 3’,
marker=Marker(color=’#b1add6’)
)

data = [trace1,trace2,trace3]
layout = plotly.graph_objs.Layout(
barmode=‘stack’,
title=‘Client Deliverables’,
paper_bgcolor=“rgba(48,48,48,1)”,
plot_bgcolor=“rgba(48,48,48,1)”,
font=dict(color=“rgba(216,216,216,1)”,
size=14),
autosize=False,
width=1000,
height=750,
margin=go.Margin(
l=50,
r=50,
b=100,
t=100,
pad=4
),
)

fig = plotly.graph_objs.Figure(data=data, layout=layout)
iplot(fig, filename=‘stacked-bar’)

Any suggestions are more than welcome. Thanks in advance!

2

@moor1204 - Instead of using iplot, you’ll want to pass your fig into the figure attribute of the dash_core_components.Graph component like dash_core_components.Graph(figure=fig).

I recommend looking through the examples in the Dash Userguide: https://plot.ly/dash/getting-started

1 Like
3

Much more elegant solution than what I was able to come up with. Thank you!