App is running locally.
Python version 3.11.4
Streamlit version 1.35.0
import streamlit as st
import plotly.graph_objects as go
st.set_page_config(page_title='example', layout='wide')
colcheck1, colcheck2, colcheck3 = st.columns([1,1,4])
with colcheck1:
mt = st.checkbox('MT')
with colcheck2:
mtr = st.checkbox('MTR')
def mtr_page():
col1, col2 = st.columns([3,10])
with col1:
fig = gauge_3()
st.plotly_chart(fig)
fig = gauge_3()
st.plotly_chart(fig)
def gauge_creation(fig, value,title,domain):
if value >= 90:
color = 'green'
elif value >=60:
color = 'yellow'
else:
color = 'red'
fig.add_trace(go.Indicator(
mode='gauge+number',
value = value,
title=title,
domain=domain,
number={'suffix':'%'},
gauge={
'axis':{'range':[0,100],'tickwidth':1, 'showticklabels':False},
'bar': {'color':color},
'borderwidth':1
}
))
return fig
def gauge_3():
fig = go.Figure()
gauge_creation(fig,92,'30day',{'row':0, 'column':1})
gauge_creation(fig,92,'90day',{'row':0, 'column':2})
gauge_creation(fig,92,'1year',{'row':0, 'column':3})
fig.add_annotation(dict(font=dict(color='white',size=15),
x=0,
y=.12,
showarrow=False,
text='Name',
xref='paper',
yref='paper'))
fig.update_layout(
grid = {'rows':1, 'columns':4, 'pattern':'independent'},
width = 500,
height = 100,
margin = {'t':50, 'b':10, 'r':26, 'l': 18}
)
return fig
def test_blank():
col1, col2 = st.columns([1,2])
with col1:
st.write('hi')
if mtr == False and mt == False:
test_blank()
if mtr:
mtr_page()
When clicking on the MTR checkbox it should display two rows of 3 gauge charts.
Like below. (This works)
After deselecting the MTR checkbox and returning to the starting page which should just have the checkoxes and ‘hi’ written. One of the gauge charts gets displayed and it looks like it is transparent.
If you repeat this process over and over it keeps adding one row of transparent gauge charts when none should be appearing. Below is an example of the transparent charts.
Any ideas on what is causing this would be appreciated. Thanks.