Search code examples
plotlybar-chartplotly-python

How to do stacked barplots and avoid error bars being hidden in Plotly


I am trying to do stacked bars plots with symmetric error bars in between the two bars, however, the error bars become hidden by the second instance of go.Bar (Example below).

import plotly.graph_objects as go
x_values = ['A','B','C','D','E']
y1_values = [0.527, 0.519, 0.497, 0.458, 0.445]
y2_values = [0.473, 0.481, 0.503, 0.542, 0.555]
y_errors = [0.05, 0.065, 0.158, 0.07, 0.056]


fig = go.Figure(data=[
    go.Bar(name='NAME1', x=x_values, y=y1_values, error_y=dict(type="data", array=y_errors)),
    go.Bar(name='NAME2', x=x_values, y=y2_values)
])
# Change the bar mode
fig.update_layout(barmode='stack')
fig.show()

stacked barplot with errorbars hidden

I could not find a solution to this in the documentation. Is there a way to alter the order of plot elements to force the error bar to appear?


Solution

  • You can get around this by plotting the NAME2 bars first, followed by the NAME1 bars – you would need to set the base of the NAME2 bars to be the y1_values of the NAME1 bars (so that the NAME2 bars start from where the NAME1 bars will be), then set the base of the NAME1 bars to be 0 to ensure they start from y=0.

    import plotly.graph_objects as go
    x_values = ['A','B','C','D','E']
    y1_values = [0.527, 0.519, 0.497, 0.458, 0.445]
    y2_values = [0.473, 0.481, 0.503, 0.542, 0.555]
    y_errors = [0.05, 0.065, 0.158, 0.07, 0.056]
    
    
    fig = go.Figure(data=[
        go.Bar(name='NAME2', x=x_values, y=y2_values, base=y1_values),
        go.Bar(name='NAME1', x=x_values, y=y1_values, error_y=dict(type="data", array=y_errors), base=[0]*5)
    ])
    
    # Change the bar mode
    fig.update_layout(barmode='stack')
    
    fig.show()
    

    enter image description here