Line chart fill behaviour


In this chart, is it possible to fill the area above the red line (shaded red) and also the area below the green line (shaded green) using standard Plotly parameters?

Anything between the two lines shouldn’t be shaded at all.

I’ve tried various combinations of fill=‘tonexty’ on each of the traces, and played around with the trace order but not getting the effect I need



Move this to the plotly python part of the community for better answers. :+1:

Hi @Chris369,

Here’s an approach using three traces.

from plotly.offline import init_notebook_mode, iplot
import plotly.graph_objs as go
import as pio

# # For classic notebook
# init_notebook_mode()

fig = go.Figure(data = [
    go.Scatter(y=[1, 3, 2], mode='lines', fill='tozeroy', line={'color': 'green'}),
    go.Scatter(y=[2, 5, 3], mode='lines', line={'color': 'red'}, showlegend=False),
    go.Scatter(y=[8, 8, 8], mode='lines', fill='tonexty', line={'color': 'red'})

Hope that helps!

Thanks for the reply. Apologies but I’ve realised I wasn’t very clear - my bad. I want the area above the red line that is also below the yellow line to be red (so only 4 sections in my screenshot). Likewise, the area below the green line but above the yellow line (3 sections). Is that possible?

Hi @Chris369,

Hmm, unfortunately I don’t think there’s an easy way to do this, but it’s definitely an interesting idea. Feel free to raise an issue with the plotly.js project ( to discuss this as a new fill mode.