Facing Same issue as "Cant Load More Than 8 Plotly Charts"

[jay23]

I have 8+ ploty graphs, all are rendering one by one, all 8 graphs are properly render, once 9th Graph is render than first graph data become invisible. On hover I can see data is there but just not visible, once I click on lenged then data become visible but very next graph data become invisible.

This is only happening when I have large data (6500+ data points) with smaller data point it is working fine.
Output image:

Code I am using for plotting graph:

for fig in figs:
st.plotly_chart(fig, use_container_width=True)

I am running it locally

Streamlit version: 1.36.0
Python: 3.9.0
plotly: 5.17.0

Note: I have updated also tried the same with latest version of plotly, streamlit and python but facing same issue.

One issue link I found Cant Load More Than 8 Plotly Charts but that solution also didn’t work

[blackary]

Can you share some simple reproducible code that shows that you’re using render_mode=‘svg’ (as the thread suggests) but still doesn’t work?

[jay23]

Thank you so much @blackary for reply, here is code i am trying:

st.plotly_chart(figs[area], use_container_width=True, render_mode=‘svg’)

[blackary]

Sorry, could you try and produce a complete script that reproduces that issue, one that I (or anyone else on the forum) could try? Maybe with some large amount of random data? Otherwise, it’s very hard to figure out what might be going wrong. I know this is probably embedded deep in some other code, but pulling out into an isolated script that anyone can run can be very helpful for two reasons:

1. It makes it easier to get help/report bugs
2. It might also help you figure out what’s the actual source of the bug

[jay23]

Thank you very much @blackary for your support so far and for guiding me.

Here is code snippet that I am trying:

import pandas as pd
import streamlit as st
import plotly.express as px

df = pd.read_csv(‘newtest.csv’)
df = df[[‘test’,‘datetime’, ‘value’]]
st.write(“Sample Dataset”)
st.write(df)

for i in range(9):
fig = px.line(df, x=“datetime”, y=“value”, title=f"testgrpah{i}", color=‘test’)
st.plotly_chart(fig, render_mode=‘svg’)

newtest.csv file: total: 6456 records
( I am not able to upload actual file due to upload restriction, so I am sharing sample data here)

	test	datetime	value
0	1	01-04-2024 00:00	491.5
1	1	01-04-2024 01:00	491.5
2	1	01-04-2024 02:00	491
3	1	01-04-2024 03:00	490.5
.
.
.
6454	1	25-12-2024 22:00	469.5
6455	1	25-12-2024 23:00	470.5
6456	1	26-12-2024 00:00	470

Output: (on hover I can see the data points)

in some rare cases same code is working but most of the time it same as the image attached

[jay23]

This is solution, worked for me: Cannot Load More Than 8 Plotly Charts · Issue #11822 · streamlit/streamlit · GitHub

import pandas as pd
import streamlit as st
import plotly.express as px
import numpy as np

lines = st.number_input(“Number of lines”, min_value=10, max_value=10000)

df = pd.DataFrame(
np.random.randn(lines, 2),
columns=[f’test{i}’ for i in range(2)]
)
df[‘test2’] = np.random.choice([‘A’, ‘B’, ‘C’], size=lines)

df = df[[“test0”, “test1”, “test2”]]
st.write(“Sample Dataset”)
st.write(df)

num_plots = st.number_input(“Number of plots to display”, min_value=1, max_value=10)

for i in range(num_plots):
fig = px.line(df, x=“test0”, y=“test1”, title=f"testgraph{i}", color=“test2”, render_mode=“svg”)
st.plotly_chart(fig)