Help with Plotly Pie chart + st.slider

Hi,

I created a Plotly pie chart with a few parameters and it displays a nice static pie chart. However when I try to add a slider, I only get errors, no doubt because my structure/syntax is incorrect.

Two questions:

  1. Is what I’m trying to do possible - filter on only three types of ‘Fuel_Types’ (ELEC, HYBR, PHEV) and add a slider for the ‘Model_Year’ so a user can move the slider to any year and see the percentages of each (well, ‘count’ but Plotly Pie chart automatically converts to percentages, which is fine).

  2. if yes, what am I doing incorrectly? I commented out the code for the slider, that’s most likely the problem area

Here is the code:

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

#Import File:
df = pd.read_csv(r'/home/mike/Environments/Streamlit/Data/eCars.csv').query("Model_Year == 2023").query("Fuel_Code in ['ELEC']")#, 'HYBR', 'PHEV'
df = df.groupby(['Manufacturer']).size().reset_index(name='Total')

#Add Slider:
#all_years = df["Model_Year"] #tried: df.Model_Year.unique() and df["Model_Year"] and others
#selected_years = st.slider("Model_Year", all_years)
#filtered_df = df[df["Model_Year"].isin(selected_years)]

fig = px.pie(filtered_df, values='Total', names='Manufacturer', title="EV Totals 1993 - 2023",)
st.plotly_chart(fig, theme=None)

The file is in my github GitHub - mike-ua/Streamlit-Data

  1. running locally
  2. app is not deployed:
  3. app not on Github yet (locally only)
  4. Python 3.10.13, Streamlit 1.28.1

Hi @mike_finko

For the following line:

Would using the following help?

filtered_df = df[df["Model_Year"] == selected_years]

Hi @dataprofessor ,

It probably does, just there are other issues in my code. When I change it to your recommendation, I get this error message:


for this line:

selected_years = st.slider("Model_Year", all_years)

So I tried to change (‘cast’) ‘Model_Year’ to an ‘int’ with:

df["Model_Year"] = df["Model_Year"].astype(int)

but the same error message, so I tried:

df["Model_Year"] = pd.to_numeric("Model_Year", downcast='float')
#and
df["Model_Year"] = pd.to_numeric("Model_Year", downcast='integer')
#POST EDIT #2:
#also tried:
fcols = df.select_dtypes('float').Model_Year
df[fcols] = df[fcols].apply(pd.to_numeric, downcast='float')

and get this error message:
Screenshot from 2024-01-18 11-02-46

Maybe there is another way to cast to a float or int?
Or is it reading line ‘0’, or the header of the columns instead of starting with the data?

Thanks,
Mike

POST EDIT #1:
forgot - I put the code to ‘cast’ to an int/float just above st.slider
here is how it looks:

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

#Import File:
df = pd.read_csv(r'/home/mike/Environments/Streamlit/Data/eCars.csv').query("Fuel_Code in ['ELEC','HYBR', 'PHEV']")

#Cast to int:
#df["Model_Year"] = df["Model_Year"].astype(int)
#df["Model_Year"] = pd.to_numeric("Model_Year", downcast='integer')
#df["Model_Year"] = pd.to_numeric("Model_Year", downcast='float'')

#Add Slider:
all_years = df.Model_Year
selected_years = st.slider("Model_Year", all_years)
filtered_df = df[df["Model_Year"]] == selected_years

fig = px.pie(filtered_df, values='Total', names='Manufacturer', title="EV Totals 1993 - 2023",)
st.plotly_chart(fig, theme=None)

Hi @mike_finko

For the line

all_years should be replaced with 3 values: minimum value, maximum value and the default value (any value in between the minimum and maximum values.

An example of this is:

st.slider('Select a value', 0, 130, 25)

More info in the Docs:

ok, now it works, thanks!

Now I see that this line is not necessary:

all_years = df.Model_Year

Coding is about efficiency (reusing code) and lot’s of ‘pointers/links’, so I thought ‘all_years’ was necessary as it was being ‘reused’ and the link to the line above was necessary - however, the line above was not necessary! :laughing:

For people like me with not great Python skills, more examples on the docs pages would help. On the bottom of the st.plotly page was this link:

“For many more examples of Plotly charts with and without the Streamlit theme, check out the plotly.streamlit.app.”

It was very helpful. But, I’ll make sure to read the docs more carefully.

Thanks again for helping,
Mike

1 Like

Glad to hear that it works now!

Coding is a journey and we all learn along the way. Thanks for the suggestion, we’re also keen on adding more examples.

If you’d still like to make use of df.Model_Year to generate the min, max and a middle value, instead of hard coding values in, I’d typically do it like this:

min_value = df.Model_Year.min()
max_value = df.Model_Year.max()
mean_value = df.Model_Year.mean()

in this way, as the data grows, the values would also adjust along with the data.

That’s good to know, I’ll test it out and add it to my ‘Code Library’
Thanks for sharing!

1 Like

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.