This is the ninth day of my participation in the First Challenge 2022. For details: First Challenge 2022.

preface

Streamlit module, Python to create Web visual pages

Let’s have a good time

The development tools

Python version: 3.6.4

Related modules:

Streamlit module;

Plotly Express module;

XLRD module;

And some modules that come with Python.

Environment set up

Install Python and add it to the environment variables. PIP installs the required related modules.

Here’s how to create a data visualization web page in Python using the Streamlit library.

Easily convert an Excel data file into a Web page for everyone to view online.

The project consists of three files: program, picture and Excel table data.

The data are as follows: a company’s year-end questionnaire survey (fictitious data), and the score of each relevant department on the work cooperation of the production department.

There are about 676 valid data pieces, anonymous questionnaire, including the department, age and score of the person who fills the questionnaire. \

Finally, the number of participants in each department was summarized and counted (data on the right).

First, install the relevant Python libraries, using Baidu Source.

# installation streamlit
pip install streamlit -i https://mirror.baidu.com/pypi/simple/

Install the Plotly Express
pip install plotly_express==0.4. 0 -i https://mirror.baidu.com/pypi/simple/

# installation XLRD
pip install xlrd==1.2. 0 -i https://mirror.baidu.com/pypi/simple/
Copy the code

Because our data files are in XLSX format, the latest version of XLRD only supports XLS files.

The XLRD version must be 1.2.0 so that pandas can successfully read data.

The command line terminal launches the web page.

The command line terminal opens the file path
cd Excel_Webapp

Run the page
streamlit run app.py
Copy the code

Success will prompt you and your browser will automatically pop up the page.

If it does not pop up automatically, you can directly access the address shown in the figure above.

The result is a data visualization web page.

At present can only be viewed in the local access, if you want to put on the web, you can deploy through the server, need to study ~

Let’s take a look at the actual code.

import pandas as pd
import streamlit as st
import plotly.express as px
from PIL import Image

Set the page name
st.set_page_config(page_title='Findings')
Set the page title
st.header('2020 Questionnaire ')
Set the page subtitle
st.subheader('Evaluation of production Department by Department in 2020')
Copy the code

The Python package is imported. Pandas handles data, Streamlit generates web pages, plotly. Express generates charts, and PIL reads images.

Set the name of the page, as well as the title and subtitle of the page.

# fetch data
excel_file = 'Each department's evaluation of the production department.xlsx'
sheet_name = 'DATA'

df = pd.read_excel(excel_file,
                   sheet_name=sheet_name,
                   usecols='B:D',
                   header=3)

# Here is the number of respondents in each department \
df_participants = pd.read_excel(excel_file,
                                sheet_name=sheet_name,
                                usecols='F:G',
                                header=3)
df_participants.dropna(inplace=True)

# Streamlit multiple selection (option data)
department = df['department'].unique().tolist()
# Streamlit slider (age data)
ages = df['age'].unique().tolist()
Copy the code

Read Excel table data, and get the age distribution and department, there are 5 departments in total.

Add slider and multiple selection of data options.

# Slider, Max, min, interval
age_selection = st.slider('age:,
                          min_value=min(ages),
                          max_value=max(ages),
                          value=(min(ages), max(ages)))

# multiple select, default select all
department_selection = st.multiselect(':',
                                      department,
                                      default=department)
Copy the code

The results are as follows.

Age ranges from 23 to 65, and the departments are marketing, logistics, purchasing, sales and finance. \

Since sliders and multiple selections are variable, the final data needs to be derived based on filtering conditions.

Filter data by selection
mask = (df['age'].between(*age_selection)) & (df['department'].isin(department_selection))
number_of_result = df[mask].shape[0]

# Obtain valid data according to screening conditions
st.markdown(F '* Valid data:{number_of_result}* ')

Group data by selection
df_grouped = df[mask].groupby(by=['score']).count()[['age']]
df_grouped = df_grouped.rename(columns={'age': 'count'})
df_grouped = df_grouped.reset_index()
Copy the code

When you get the data, you can draw a bar chart.

Draw a bar chart and configure related parameters
bar_chart = px.bar(df_grouped,
                   x='score',
                   y='count',
                   text='count',
                   color_discrete_sequence=['#F63366'] *len(df_grouped),
                   template='plotly_white')
st.plotly_chart(bar_chart)
Copy the code

Plot the bar chart using Plotly.

As we adjust the options on the page, the valid data and the bar chart change accordingly.

Streamlit can also add images and interactive tables to web pages.

Col1, col2 = st.beta_columns(2) image = image.open ('survey. JPG ') col1. Select ='Designed by ', use_column_width=True) col2.dataframe(df[mask], width=300)Copy the code

The result is as follows.

You can see that the table has a slider that you can scroll through using the mouse wheel.

Finally, draw a pie chart!

# Chart the pie
pie_chart = px.pie(df_participants,
                   title='Total participants',
                   values='number',
                   names='Corporate Sector')
st.plotly_chart(pie_chart)
Copy the code

The results are as follows.

The number of people taking part in the questionnaire survey in each department is also an interactive chart.

When sales, marketing and logistics are removed, we can see the proportion of respondents in finance and purchasing.