In the figure, the green line fills itself up till the red line from 0 (on the x axis) to their point of intersection because of fill = 'tonexty'
, thus overlapping the red and the blue fill. Then, the purple line fills itself till the green line overlapping the red and the blue. How can I prevent these overlaps?
I want the green line to fill only when it's above the red line. And the purple line to fill itself till the next top most line it encounters which here are the green and the red
For reference, I want it to look like this-
Here is the code to reproduce the plot-
import pandas as pd
import plotly.graph_objects as go
df = pd.DataFrame({'x': [0,1,2,3,4],
'y1': [0,3,7,9,17],
'y2': [0,5,8,11,21],
'y3': [0,0,0,15,25],
'y4': [0,10,20,30,40]})
fig = go.Figure()
fig.add_scatter(x=df.x, y=df.y1, fill='tozeroy', name='y1')
fig.add_scatter(x=df.x, y=df.y2, fill='tonexty', name='y2')
fig.add_scatter(x=df.x, y=df.y3, fill='tonexty', name='y3')
fig.add_scatter(x=df.x, y=df.y4, fill='tonexty', name='y3')
fig.update_xaxes(nticks=5)
fig.show()
This is somewhat similar to this question. But I want to fill not between two lines but rather between one line and possibly many other lines it encounters (all the lines adjacent to it).