CODEWITHSUNDEEP
pythonplotly-dash
pandashugger
pandashugger

Reputation: 39

Plotly Dash - Adding Horizontal Line on Bar Plot

I'm trying to create a horizontal line on my bar chart, which I was able to do like so using a scatterplot as another trace.enter image description here

However, because the red line does not extend fully, I'm trying to use the Shapes parameter in go.Layout but it is giving me this error:

Invalid value of type 'builtins.dict' received for the 'shapes' property of layout Received value: {'type': 'line', 'x0': 0, 'y0': 2, 'x1': 4, 'y1': 2, 'line': {'color': 'red', 'width': 4, 'dash': 'dashdot'}} The 'shapes' property is a tuple of instances of Shape that may be specified as: - A list or tuple of instances of plotly.graph_objs.layout.Shape - A list or tuple of dicts of string/value properties that will be passed to the Shape constructor

This is the code

bar_chart = [go.Bar(x=competitor_df.index,
                    y=competitor_df['competitor_cost'],
                    marker_color=colors,
                    marker_line_width=1.5,
                    marker_line_color='#505461',
                    textposition='outside',
                    texttemplate="$%{y}")]
                 
layout = go.Layout(yaxis=dict(range=[0, competitor_df.max]),
                   xaxis=dict(range=[0, 4]),
                   shapes=dict(
                               type='line', 
                               x0=0, 
                               y0=2, 
                               x1=4, 
                               y1=2, 
                               line=dict(color='red', width=4, dash='dashdot')))
    
fig = {'data':bar_chart, 'layout':layout}

Any help is much appreciated!

Upvotes: 1

Views: 3896

Answers (1)

hans
hans

Reputation: 343

This is an issue in plotly with categorical data. You will need to use absolute/paper positioning for your horizontal line, something like

fig.add_shape(type="line",
    xref="paper", yref="paper",
    x0=0, y0=0.8,
    x1=1, y1=0.8,
    line=dict(
        color="magenta",
        width=3,
    ),
             )

Upvotes: 2

Related Questions