# Filled area behind behind bar in Python?

**URL:** <https://community.plotly.com/t/filled-area-behind-behind-bar-in-python/6383>\
**Category:** 📊 Plotly Python\
**Created:** [October 19, 2017, 4:01pm UTC](https://community.plotly.com/t/filled-area-behind-behind-bar-in-python/6383 "2017-10-19T16:01:44Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![sambrownamey](https://avatars.discourse-cdn.com/v4/letter/s/278dde/32.png) [@sambrownamey](https://community.plotly.com/u/sambrownamey)\
**Post date:** [October 19, 2017, 4:01pm UTC](https://community.plotly.com/t/filled-area-behind-behind-bar-in-python/6383/1 "2017-10-19T16:01:45Z")

</div>

Hello  
I’d like to create a plot like the picture, but with the filled area behind the bars rather than overlaid. Is this possible? Ideally I want the line to still be above the bars, but the area to be behind. It looks like this whichever order I pass the traces in.

 ![image](https://us1.discourse-cdn.com/flex024/uploads/plot/original/2X/3/3b7c358fb76659caaf3a79823738a10c1d96fe17.png)

Thanks  
Sam

---

<div class="post-metadata">

**Author:** ![jack](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/jack/32/11_2.png) [@jack](https://community.plotly.com/u/jack)\
**Post date:** [October 20, 2017, 12:55am UTC](https://community.plotly.com/t/filled-area-behind-behind-bar-in-python/6383/2 "2017-10-20T00:55:10Z")

</div>

Yep, just pass in the line chart before the bar chart in the `data` array and you should be good-to-go.

---

<div class="post-metadata">

**Author:** ![sambrownamey](https://avatars.discourse-cdn.com/v4/letter/s/278dde/32.png) [@sambrownamey](https://community.plotly.com/u/sambrownamey)\
**Post date:** [October 20, 2017, 7:57am UTC](https://community.plotly.com/t/filled-area-behind-behind-bar-in-python/6383/4 "2017-10-20T07:57:29Z")

</div>

Thank you for the answer 🙂 Unfortunately it doesn’t seem to work for me. e.g:

```auto
line_data = bar_data[::-1]/2
index = np.arange(10)

trace1 = go.Scatter(
    x=index,
    y=line_data,
    name="Filled line",
    mode ="lines+markers",
    fill = "tozeroy",
    fillcolor = 'rgba(1,1,1, 0.8)',
    line = dict(
        width = 1),
    marker = dict(
        color = "#333",
        size = 5,
        symbol = '.'))

trace2 = go.Bar(
    x=index,
    y=bar_data,
    name="Bar")

traces = [
    trace1,
    trace2
]

layout = go.Layout(
    xaxis=dict(title='x axis'),
    yaxis=dict(title='y axis'),

    legend=dict(xanchor="center", orientation="h", x=0.5, y=-0.2),
    title='Title'
)

fig = go.Figure(data=traces, layout=layout)
py.iplot(fig)

```

gives the same whichever order I pass in the two traces (except that the colour of the bars shifts between blue and orange).

 ![image](https://us1.discourse-cdn.com/flex024/uploads/plot/original/2X/5/560668319c379800e1ffeb297fce77a3c36760e3.png)

Am using `plotly.offline` and version 2.0.13.  
Thanks  
Sam

---

<div class="post-metadata">

**Author:** ![gaw89](https://avatars.discourse-cdn.com/v4/letter/g/eb9ed0/32.png) [@gaw89](https://community.plotly.com/u/gaw89)\
**Post date:** [November 13, 2019, 12:23pm UTC](https://community.plotly.com/t/filled-area-behind-behind-bar-in-python/6383/6 "2019-11-13T12:23:45Z")

</div>

Did you ever find a solution to this issue? I am experiencing the same problem now.

Thanks!

---

<div class="post-metadata">

**Author:** ![Emmanuelle](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/emmanuelle/32/7853_2.png) [@Emmanuelle](https://community.plotly.com/u/Emmanuelle)\
**Post date:** [November 13, 2019, 4:35pm UTC](https://community.plotly.com/t/filled-area-behind-behind-bar-in-python/6383/7 "2019-11-13T16:35:00Z")

</div>

For this you can add a second y axis y2 overlaying y, as below

```auto
import plotly.graph_objects as go
import numpy as np
index = np.arange(10)
line_data = np.arange(10)
bar_data = np.ones(10)
bar_data[::2] = 2

trace1 = go.Scatter(
    x=index,
    y=line_data,
    name="Filled line",
    mode ="lines+markers",
    fill = "tozeroy",
    fillcolor = 'rgba(1,1,1, 0.8)',
    line = dict(
        width = 1),
    marker = dict(
        color = "#333",
        size = 5))

trace2 = go.Bar(
    x=index,
    y=bar_data,
    name="Bar",
    yaxis="y2")

traces = [
    trace1,
    trace2
]

fig = go.Figure(data=traces)
fig.update_layout(yaxis2=dict(overlaying='y'))
fig.show()

```