Search code examples
pythonplotly

Bar chart not updated when button is selected for a plotly python graph

Below plotly code renders bar graph with buttons to select either stack or group style. But chart does not updates style when a selection is made on button. How do I fix this:

fig1 = go.Figure()

x  = temp_df.index
y1 = temp_df['Sales'].astype(float) # Sales Column
y2 = temp_df['Expenses'].astype(float) # Expenses Column
y3 = temp_df['Operating Profit'].astype(float) # Expenses Column
y4 = temp_df['Net Profit'].astype(float) # Expenses Column

fig1.add_trace(go.Bar(x=x, y=y1, name='Sales', marker_color ="#4287f5"))
fig1.add_trace(go.Bar(x=x, y=y2, name='Expenses', marker_color ="#f06969"))
fig1.add_trace(go.Bar(x=x, y=y3, name='Operating Profit', marker_color ="#469984"))
fig1.add_trace(go.Bar(x=x, y=y4, name='Net Profit', marker_color ="#53c24f"))

fig1.update_layout(
        title='<b>QoQ Performance</b>',
        xaxis_title='Quarter',
        yaxis_title='Rupees in Cr.')

updatemenus=[
        dict(
            type = "buttons",
            buttons=list([
                dict(
                    args=['barmode', 'Group'],
                    label="Group",
                    method="update",
                ),
                dict(
                    args=["barmode", "stack"],
                    label="Stack",
                    method="update"
                )
            ]) 
        ),
    ]

fig1.update_layout(updatemenus=updatemenus)
fig1.show()

enter image description here

Reference Dataframe. Index is Quarter.

Quarter Sales Expenses Operating Profit Net Profit
q1 674.3 529.47 144.83 48.81
q2 634.32 498.08 136.24 45.91
q3 338.17 265.54 72.63 24.48
q4 1209.9 949.99 259.86 87.57
Solution

  • If you want a quick fix then just change method="update" to method="relayout".

    Also, find an optimized version of code below,

    import plotly.graph_objects as go

fig1 = go.Figure()


data = {
    'Quarter': ['q1', 'q2', 'q3', 'q4'],
    'Sales': [674.3, 634.32, 338.17, 1209.9],
    'Expenses': [529.47, 498.08, 265.54, 949.99],
    'Operating Profit': [144.83, 136.24, 72.63, 259.86],
    'Net Profit': [48.81, 45.91, 24.48, 87.57]
}
temp_df = pd.DataFrame(data)

x = temp_df.index
y1 = temp_df['Sales'].astype(float)
y2 = temp_df['Expenses'].astype(float)
y3 = temp_df['Operating Profit'].astype(float)
y4 = temp_df['Net Profit'].astype(float)

fig1.add_trace(go.Bar(x=x, y=y1, name='Sales', marker_color="#4287f5"))
fig1.add_trace(go.Bar(x=x, y=y2, name='Expenses', marker_color="#f06969"))
fig1.add_trace(go.Bar(x=x, y=y3, name='Operating Profit', marker_color="#469984"))
fig1.add_trace(go.Bar(x=x, y=y4, name='Net Profit', marker_color="#53c24f"))

fig1.update_layout(
    title='<b>QoQ Performance</b>',
    xaxis_title='Quarter',
    yaxis_title='Rupees in Cr.')

updatemenus=[
    dict(
        type="buttons",
        buttons=list([
            dict(
                label="Group",
                method="relayout",
                args=[{"barmode": "group"}]
            ),
            dict(
                label="Stack",
                method="relayout",
                args=[{"barmode": "stack"}]
            )
        ])
    )
]
    
fig1.update_layout(updatemenus=updatemenus)
fig1.show()