I am creating a streamlit app using plotly. I use some database function to collect data from database and plot it in a line graph. The line graph should be colored in segments. I searched in google and plotly forms but didn’t find anything. Thus, I implemented it so that the base line is plotted and on top of that line other small lines (of the specific color) is plotted which overlays the original line. Thus, this creates an illusion of a multi color line is created.
Following is my code for plotting of graph.
cur.execute(f"SELECT timestamp,{data['value']} FROM symbolsdata WHERE symbol='{selectedScreener}' AND timeframe='{t}' ORDER BY timestamp DESC LIMIT {data['range']}")
df=[i for i in cur.fetchall()]
df=pd.DataFrame(df)
df.set_index(df.columns[0],inplace=True)
df.columns=[name]
df["color"]=list(df.applymap(data["color"])[name])
isFirstStorke=True
trace=[]
for i,c in enumerate(data["colorSequence"][::1]):
df1=df.copy()
if isFirstStorke:
# df1.loc[df1["color"]!=c,name]=None
isFirstStorke=False
else:
df1.loc[df1["color"]!=c,name]=None
trace.append(
go.Scatter(
x=df1.index,
y=df1[name],
mode=data["type"],
line_color=c
# line_width=i+1
# marker_color=df["color"]
)
)
fig.add_traces(trace[::-1])
fig.update_layout(height=200,margin={"r":20,"l":20,"t":50,"b":10},showlegend=False,)
fig.update_yaxes(range=data["chartRange"] if data["chartRange"] else None)
container.plotly_chart(fig,use_container_width=True)
This works well but sometime this creates ghost line in the chart.
Some examples->
I am not sure of the cause. Also this lines are not hover able only the original lines are.
Need solution of this issue!