Skip to content

Instantly share code, notes, and snippets.

@khurchla

khurchla/radial_charts.py

Created May 27, 2022 23:05
Show Gist options
  • Save khurchla/1f748006fbd46f611ce6aa08f272ff89 to your computer and use it in GitHub Desktop.
Save khurchla/1f748006fbd46f611ce6aa08f272ff89 to your computer and use it in GitHub Desktop.
Download ZIP
Plotly Dash Python Radial Chart manual subplots
Raw
radial_charts.py
values = {'Timestamp':['5/20/2022 19:44:43', '5/20/2022 20:14:36',
'5/20/2022 20:14:38', '5/20/2022 20:14:39',
'5/20/2022 19:44:43', '5/20/2022 20:14:46',
'5/20/2022 20:14:47', '5/20/2022 19:44:49',
'5/20/2022 20:14:51', '5/20/2022 20:14:53',
'5/20/2022 20:14:56'],
'Build':[6, 4, 6, 6, 3, 6, 1, 4, 5, 6, 2],
'Story':[6, 3, 6, 5, 6, 3, 1, 3, 3, 3, 1],
'Design':[6, 6, 5, 4, 4, 4, 2, 6, 1, 2, 2],
'Systems':[6, 2, 6, 1, 1, 5, 6, 1, 2, 3, 2],
'Analytical':[4, 1, 5, 5, 6, 3, 1, 3, 3, 3, 1],
'Build1':[3, 6, 6, 6, 6, 5, 4, 4, 4, 2, 6],
'Story1':[4, 3, 6, 5, 6, 3, 1, 3, 3, 3, 1],
'Design1':[6, 6, 5, 1, 5, 6, 1, 2, 3, 2, 6],
'Systems1':[5, 2, 6, 6, 6, 5, 4, 4, 4, 2, 6],
'Analytical1':[5, 6, 6, 3, 6, 6, 6, 6, 5, 4, 4]
}
# store values in dataframe
df = pd.DataFrame(values, columns=values[0])
# instantiate Dash app with bootstrat theme stylesheet
app = Dash(__name__, external_stylesheets=[dbc.themes.SKETCHY])
### build the radar graph figure
categories = ['Build', 'Story','Design','Systems','Analytical','Build']
# make a figure with subplots, # of rows, # of plots per row (cols)
fig = make_subplots(rows=6, cols=2, specs=[[{'type': 'polar'}] * 2] * 6) # replaces go.Figure() used for single chart
# manually make small multiples, each chart with two traces,
# and assigned to a row and column position in figure
# first plot 0
fig.add_trace(
go.Scatterpolar(
# for first record/row after column headers, and
# columns for the questions about your Values
r=df.loc[0,['Build', 'Story','Design','Systems','Analytical','Build']], # .iloc[1, np.r_[2,4,1,5,3,2]],
theta=categories,
marker_color='red',
name='Value',
),
row=1,
col=1,
)
fig.add_trace(
go.Scatterpolar(
# for first record/row after column headers, and
# columns for the questions about your Strengths
# close lines with go.Scatterpolar by repeating the first point in your trace at the end using numpy.r to concatenate slices
r=df.loc[0,['Build1', 'Story1','Design1','Systems1','Analytical1','Build1']], # .iloc[1, np.r_[7,9,6,10,8,7]],
theta=categories,
marker_color='#828582',
name='Strength',
),
row=1,
col=1,
)
# next plot 1
fig.add_trace(
go.Scatterpolar(
# for first record/row after column headers, and
# columns for the questions about your Values
r=df.loc[1,['Build', 'Story','Design','Systems','Analytical','Build']], # .iloc[2, np.r_[2,4,1,5,3,2]],
theta=categories,
marker_color='red',
name='Value',
),
row=1,
col=2,
)
fig.add_trace(
go.Scatterpolar(
# for first record/row after column headers, and
# columns for the questions about your Strengths
r=df.loc[1,['Build1', 'Story1','Design1','Systems1','Analytical1','Build1']], # .iloc[2, np.r_[7,9,6,10,8,7]],
theta=categories,
marker_color='#828582',
name='Strength'
),
row=1,
col=2,
)
# next plot 2
fig.add_trace(
go.Scatterpolar(
# for first record/row after column headers, and
# columns for the questions about your Values
r=df.loc[2,['Build', 'Story','Design','Systems','Analytical','Build']], # .iloc[2, np.r_[2,4,1,5,3,2]],
theta=categories,
marker_color='red',
name='Value',
),
row=2,
col=1,
)
fig.add_trace(
go.Scatterpolar(
# for first record/row after column headers, and
# columns for the questions about your Strengths
r=df.loc[2,['Build1', 'Story1','Design1','Systems1','Analytical1','Build1']], # .iloc[2, np.r_[7,9,6,10,8,7]],
theta=categories,
marker_color='#828582',
name='Strength'
),
row=2,
col=1,
)
# next plot 3
fig.add_trace(
go.Scatterpolar(
# for first record/row after column headers, and
# columns for the questions about your Values
r=df.loc[3,['Build', 'Story','Design','Systems','Analytical','Build']], # .iloc[2, np.r_[2,4,1,5,3,2]],
theta=categories,
marker_color='red',
name='Value',
),
row=2,
col=2,
)
fig.add_trace(
go.Scatterpolar(
# for first record/row after column headers, and
# columns for the questions about your Strengths
r=df.loc[3,['Build1', 'Story1','Design1','Systems1','Analytical1','Build1']], # .iloc[2, np.r_[7,9,6,10,8,7]],
theta=categories,
marker_color='#828582',
name='Strength'
),
row=2,
col=2,
)
# next plot 4
fig.add_trace(
go.Scatterpolar(
# for first record/row after column headers, and
# columns for the questions about your Values
r=df.loc[4,['Build', 'Story','Design','Systems','Analytical','Build']], # .iloc[2, np.r_[2,4,1,5,3,2]],
theta=categories,
marker_color='red',
name='Value',
),
row=3,
col=1,
)
fig.add_trace(
go.Scatterpolar(
# for first record/row after column headers, and
# columns for the questions about your Strengths
r=df.loc[4,['Build1', 'Story1','Design1','Systems1','Analytical1','Build1']], # .iloc[2, np.r_[7,9,6,10,8,7]],
theta=categories,
marker_color='#828582',
name='Strength'
),
row=3,
col=1,
)
# next plot 5
fig.add_trace(
go.Scatterpolar(
# for first record/row after column headers, and
# columns for the questions about your Values
r=df.loc[5,['Build', 'Story','Design','Systems','Analytical','Build']], # .iloc[2, np.r_[2,4,1,5,3,2]],
theta=categories,
marker_color='red',
name='Value',
),
row=3,
col=2,
)
fig.add_trace(
go.Scatterpolar(
# for first record/row after column headers, and
# columns for the questions about your Strengths
r=df.loc[5,['Build1', 'Story1','Design1','Systems1','Analytical1','Build1']], # .iloc[2, np.r_[7,9,6,10,8,7]],
theta=categories,
marker_color='#828582',
name='Strength'
),
row=3,
col=2,
)
# next plot 6
fig.add_trace(
go.Scatterpolar(
# for first record/row after column headers, and
# columns for the questions about your Values
r=df.loc[6,['Build', 'Story','Design','Systems','Analytical','Build']], # .iloc[2, np.r_[2,4,1,5,3,2]],
theta=categories,
marker_color='red',
name='Value',
),
row=4,
col=1,
)
fig.add_trace(
go.Scatterpolar(
# for first record/row after column headers, and
# columns for the questions about your Strengths
r=df.loc[6,['Build1', 'Story1','Design1','Systems1','Analytical1','Build1']], # .iloc[2, np.r_[7,9,6,10,8,7]],
theta=categories,
marker_color='#828582',
name='Strength'
),
row=4,
col=1,
)
# next plot 7
fig.add_trace(
go.Scatterpolar(
# for first record/row after column headers, and
# columns for the questions about your Values
r=df.loc[7,['Build', 'Story','Design','Systems','Analytical','Build']], # .iloc[2, np.r_[2,4,1,5,3,2]],
theta=categories,
marker_color='red',
name='Value',
),
row=4,
col=2,
)
fig.add_trace(
go.Scatterpolar(
# for first record/row after column headers, and
# columns for the questions about your Strengths
r=df.loc[7,['Build1', 'Story1','Design1','Systems1','Analytical1','Build1']], # .iloc[2, np.r_[7,9,6,10,8,7]],
theta=categories,
marker_color='#828582',
name='Strength'
),
row=4,
col=2,
)
# next plot 8
fig.add_trace(
go.Scatterpolar(
# for first record/row after column headers, and
# columns for the questions about your Values
r=df.loc[8,['Build', 'Story','Design','Systems','Analytical','Build']], # .iloc[2, np.r_[2,4,1,5,3,2]],
theta=categories,
marker_color='red',
name='Value',
),
row=5,
col=1,
)
fig.add_trace(
go.Scatterpolar(
# for first record/row after column headers, and
# columns for the questions about your Strengths
r=df.loc[8,['Build1', 'Story1','Design1','Systems1','Analytical1','Build1']], # .iloc[2, np.r_[7,9,6,10,8,7]],
theta=categories,
marker_color='#828582',
name='Strength'
),
row=5,
col=1,
)
# next plot 9
fig.add_trace(
go.Scatterpolar(
# for first record/row after column headers, and
# columns for the questions about your Values
r=df.loc[9,['Build', 'Story','Design','Systems','Analytical','Build']], # .iloc[2, np.r_[2,4,1,5,3,2]],
theta=categories,
marker_color='red',
name='Value',
),
row=5,
col=2,
)
fig.add_trace(
go.Scatterpolar(
# for first record/row after column headers, and
# columns for the questions about your Strengths
r=df.loc[9,['Build1', 'Story1','Design1','Systems1','Analytical1','Build1']], # .iloc[2, np.r_[7,9,6,10,8,7]],
theta=categories,
marker_color='#828582',
name='Strength'
),
row=5,
col=2,
)
# next plot 10
fig.add_trace(
go.Scatterpolar(
# for first record/row after column headers, and
# columns for the questions about your Values
r=df.loc[10,['Build', 'Story','Design','Systems','Analytical','Build']], # .iloc[2, np.r_[2,4,1,5,3,2]],
theta=categories,
marker_color='red',
name='Value',
),
row=6,
col=1,
)
fig.add_trace(
go.Scatterpolar(
# for first record/row after column headers, and
# columns for the questions about your Strengths
r=df.loc[10,['Build1', 'Story1','Design1','Systems1','Analytical1','Build1']], # .iloc[2, np.r_[7,9,6,10,8,7]],
theta=categories,
marker_color='#828582',
name='Strength'
),
row=6,
col=1,
)
# # next plot 11
# fig.add_trace(
# go.Scatterpolar(
# # for first record/row after column headers, and
# # columns for the questions about your Values
# r=df.loc[11,['Build', 'Story','Design','Systems','Analytical','Build']], # .iloc[2, np.r_[2,4,1,5,3,2]],
# theta=categories,
# marker_color='red',
# name='Value',
# ),
# row=6,
# col=2,
# )
# fig.add_trace(
# go.Scatterpolar(
# # for first record/row after column headers, and
# # columns for the questions about your Strengths
# r=df.loc[11,['Build1', 'Story1','Design1','Systems1','Analytical1','Build1']], # .iloc[2, np.r_[7,9,6,10,8,7]],
# theta=categories,
# marker_color='#828582',
# name='Strength'
# ),
# row=6,
# col=2,
# )
# style the traces
fig.update_traces(
fill='toself', # fills in each with same color
opacity=0.8, # of the fill
line = dict(
shape='spline', # curved lines between points
smoothing=0.8,
)
)
# update the layout
fig.update_layout(
# width=500,
height=1500, # 768?
autosize=True,
polar=dict(
radialaxis=dict(
visible=True,
range=[0, 6],
showticklabels=False,
tickangle=-45,
tickcolor='lightgray',
# tickfont='Lexand',
ticklabelstep=3,
),
),
polar1=dict(
radialaxis=dict(
visible=True,
range=[0, 6],
showticklabels=False,
# tickangle=-45,
# tickcolor='lightgray',
# # tickfont='Lexand',
# ticklabelstep=3,
),
),
polar2=dict(
radialaxis=dict(
visible=True,
range=[0, 6],
showticklabels=False,
# tickangle=-45,
# tickcolor='lightgray',
# # tickfont='Lexand',
# ticklabelstep=3,
),
),
polar3=dict(
radialaxis=dict(
visible=True,
range=[0, 6],
showticklabels=False,
# tickangle=-45,
# tickcolor='lightgray',
# # tickfont='Lexand',
# ticklabelstep=3,
),
),
polar4=dict(
radialaxis=dict(
visible=True,
range=[0, 6],
showticklabels=False,
# tickangle=-45,
# tickcolor='lightgray',
# # tickfont='Lexand',
# ticklabelstep=3,
),
),
polar5=dict(
radialaxis=dict(
visible=True,
range=[0, 6],
showticklabels=False,
# tickangle=-45,
# tickcolor='lightgray',
# # tickfont='Lexand',
# ticklabelstep=3,
),
),
polar6=dict(
radialaxis=dict(
visible=True,
range=[0, 6],
showticklabels=False,
# tickangle=-45,
# tickcolor='lightgray',
# # tickfont='Lexand',
# ticklabelstep=3,
),
),
polar7=dict(
radialaxis=dict(
visible=True,
range=[0, 6],
showticklabels=False,
# tickangle=-45,
# tickcolor='lightgray',
# # tickfont='Lexand',
# ticklabelstep=3,
),
),
polar8=dict(
radialaxis=dict(
visible=True,
range=[0, 6],
showticklabels=False,
# tickangle=-45,
# tickcolor='lightgray',
# # tickfont='Lexand',
# ticklabelstep=3,
),
),
polar9=dict(
radialaxis=dict(
visible=True,
range=[0, 6],
showticklabels=False,
# tickangle=-45,
# tickcolor='lightgray',
# # tickfont='Lexand',
# ticklabelstep=3,
),
),
polar10=dict(
radialaxis=dict(
visible=True,
range=[0, 6],
showticklabels=False,
# tickangle=-45,
# tickcolor='lightgray',
# # tickfont='Lexand',
# ticklabelstep=3,
),
),
# polar11=dict(
# radialaxis=dict(
# visible=True,
# range=[0, 6],
# showticklabels=False,
# # tickangle=-45,
# # tickcolor='lightgray',
# # # tickfont='Lexand',
# # ticklabelstep=3,
# ),
# ),
showlegend=False, # hide because it's either going to show it for every subplot and appear to be duplicating or none
title=dict(
font=dict(
size=30,
color='#828582',
# family='Lexand'
),
# using HTML span tag inline to change color within text
# and a <br> break tag for a line separater and two line title
# in this way you can show color meaning without a legend
text="Strengths<br><span style='color:red'>Values</span>"
),
)
### begin app layout
layout = html.Div(
[
dbc.Container([
dbc.Row([
dbc.Col([
html.H2(
"Radial Charts App/page title here",
style={"textAlign":"center", "marginTop":15}
),
dcc.Graph(figure=fig)
],width=12)
])
])
]
)
# that's it for a multi-page app page file,
# or below will run this as a standalone app
# if __name__=="__main__":
# app.run(debug=True)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment