Your Web News in One Place

Help Webnuz

Referal links:

Sign up for GreenGeeks web hosting
March 31, 2022 05:55 pm GMT

Bar Chat Webapp With Streamlit & Plotly

I need to celebrate this little but purposeful achievement of mine lol.

My journey to get to work with Stream lit was a very rough but exciting journey

I just couldn't understand how it worked after several trials, I am glad to say i finally did it.

I love Stream lit and Plotly a whole lot now.

I built a simple bar chat web app using Streamlit and Plotly.

The reason I am sharing my simple project is to help anyone struggling with building a web app using Streamlit.

It took me a very long time to finally understand and be able to build a simple bar chat with Stream lit.

And I know there are several other people like me who is currently battling with building a data science project with Stream lit.

Deploying my apps to Heroku is still a work in progress for me, but the Heroku team have been extremely helpful by guiding me through emails.

Here is how I built my first ever simple bar chat with Stream lit & Plotly

Streamlit Documentation

Plotly Graph Guides

Step 1:

I used Pycharm as my IDE for this project.

I installed Streamlit, Plotly, Numpy & Pandas as my library frame work

I downloaded a supermarket sales dataset from Kaggle

import streamlit as stimport pandas as pdimport plotly.express as pxst.title('Streamlit')st.subheader('An App By Pink Data Hub')st.markdown("""This Web app will help you analyze the following;* Your top 10 selling products* Your Total Profits For Each Month and Year* Your top 10 best buying Customers and their locations""")sales_data = pd.read_csv('supermarket_sales.csv')st.write(sales_data.head())select_branch=st.selectbox('What Branch would you like to visualize?',                             ['A','B','C'])select_xaxis = st.selectbox('What variable do you want on the X axis',                            ['Customer type','Gender',                             'Date','Payment','Rating'])select_yaxis = st.selectbox('What variable do you want on the Y axis',                            ['Unit price','Quantity','Tax5%','Total',                             'cogs','gross margin percentage','gross income'])select_product = st.selectbox('What product do you want to visualize?',                              ['Food and beverages','Fashion accessories',                               'Electronic accessories','Sports and travel',                               'Home and lifestyle','Health and beauty'])sales_data = pd.read_csv('supermarket_sales.csv')sales_data = sales_data[sales_data['Branch'] == select_branch]sales_data = sales_data[sales_data['Product line'] == select_product]sales_data = sales_data.groupby(sales_data[select_xaxis])[select_yaxis].sum().head(10).reset_index()fig = px.bar(x=sales_data[select_xaxis], y=sales_data[select_yaxis])st.plotly_chart(fig, use_container_width=True)

Step 2:

I deployed my app using Streamlit cloud

To deploy my app I uploaded my project file to GitHub Read more..

I created a Requirements.txt file. A Requirement file just contains all the libraries you used for your project

streamlit==0.86.0streamlit-foliumpandas<1.2.0plotly==5.2.1dashnumpy==1.21.2pillowplotly-express

Step 3:

I deployed my app to Streamlit cloud

Here is a link to my app My Streamlit App

This is just the beginning for me, I will still develop more amazing data app and deploy them all to Heroku

Thank you for starting this journey with me


Original Link: https://dev.to/designegycreatives/bar-chat-webapp-with-streamlit-plotly-14c7

Share this article:    Share on Facebook
View Full Article

Dev To

An online community for sharing and discovering great ideas, having debates, and making friends

More About this Source Visit Dev To