data analysis

app.py

@@ -1,7 +1,83 @@
 import streamlit as st
+import matplotlib.pyplot as plt
+import pandas as pd
+import numpy as np
+from pylab import matplotlib
+from matplotlib import font_manager
+
+
+st.title(":flag-tw: 家庭收支調查")
+st.header(':grey[縣市每人平均月消費]', divider='rainbow')
+st.markdown('[*資料來源：行政院主計總處家庭收支調查*](https://www.stat.gov.tw/cp.aspx?n=3914)')
+
+
+cost = pd.read_csv('./dataset/cost.csv', encoding='utf-8')
+
+if 'clicked' not in st.session_state:
+    st.session_state.clicked = False
+
+def click_button():
+    st.session_state.clicked = True
+
+st.sidebar.subheader('調整參數：')
+city = st.sidebar.multiselect('選擇想要顯示的**縣市**...', cost.columns, default=["年別", "新北市", "臺北市", "桃園市", "臺中市", "臺南市", "高雄市"])
+year_range = st.sidebar.slider('選擇想要顯示的**年份**...', cost['年別'].unique()[0], cost['年別'].unique()[-1], (109, 111), step=1)
+year = [i for i in range(year_range[0], year_range[1]+1, 1)]
+
+
+
+st.button('點擊顯示圖表', on_click=click_button)
+
+if st.session_state.clicked:
+    st.subheader(f'表1：民國 {year_range[0]} 至 {year_range[1]} 年', divider='grey')
+    cost_select = cost[cost["年別"].isin(year)][city]
+    st.write(cost_select)
+    st.divider()
+    
+    # setup fonts for display mandarin characters
+    font_file = "./fonts/jf-openhuninn-2.0.ttf"  # The path to the custom font file.
+    font_manager.fontManager.addfont(font_file)
+    matplotlib.rcParams['font.family'] = ['jf-openhuninn-2.0', 'sans-serif']
+    
+    
+    col1, col2 = st.columns(2)
+    # 長條圖
+    with col1:
+        st.pyplot(cost_select.plot(x='年別', kind='bar',title='長條圖').legend(bbox_to_anchor=(1.0, 1.0), fontsize='small').figure)
+    
+    # 堆疊長條圖
+    with col2:
+        st.pyplot(cost_select.plot(x='年別', kind='bar',title='堆疊長條圖', stacked=True).legend(bbox_to_anchor=(1.0, 1.0), fontsize='small').figure)
+    st.divider()
+    
+    col1, col2 = st.columns(2)
+    # 面積圖
+    with col1:
+        st.pyplot(cost_select.plot(x='年別', kind='area',title='面積圖', stacked=False).legend(bbox_to_anchor=(1.0, 1.0), fontsize='small').figure)
+    
+    # 堆疊長條圖
+    with col2:
+        st.pyplot(cost_select.plot(x='年別', kind='area',title='堆疊面積圖', stacked=True).legend(bbox_to_anchor=(1.0, 1.0), fontsize='small').figure)
+    st.divider()
+    
+    col1, col2 = st.columns(2)
+    # 折線圖
+    with col1:
+        st.pyplot(cost_select.plot(x='年別', kind='line',title='折線圖').legend(bbox_to_anchor=(1.0, 1.0), fontsize='small').figure)
+    
+    # 折線圖，變換線條形式
+    with col2:
+        st.pyplot(cost_select.plot(x='年別', kind='line',title='折線圖-o', style='-o').legend(bbox_to_anchor=(1.0, 1.0), fontsize='small').figure)
+    st.divider()
+
+    st.session_state.clicked = False
+
+
+
+
+
+
+
+
+
 
-st.markdown('# Hello World')
-st.markdown('### I am XXX')
-st.text("Go to play")
-x = st.slider('Select a value')
-st.write(x, 'squared is', x * x)

dataset/cost.csv

@@ -0,0 +1,13 @@
+年別,總平均,新北市,臺北市,桃園市,臺中市,臺南市,高雄市,宜蘭縣,新竹縣,苗栗縣,彰化縣,南投縣,雲林縣,嘉義縣,屏東縣,臺東縣,花蓮縣,澎湖縣,基隆市,新竹市,嘉義市
+100,18465,18722,25321,19466,17544,16479,18100,15834,21012,15314,13646,15426,13696,14901,15473,13339,16498,14178,18824,23723,16405
+101,18774,18843,25279,19426,18295,16440,18367,17689,20906,15557,14946,16281,13823,16910,14786,14286,17173,14655,18862,23689,18808
+102,19416,19131,26672,19490,19805,17160,19081,18266,20925,15987,14370,15857,15176,16740,14623,15700,15880,15191,20681,25675,19970
+103,19978,19512,27004,19783,20801,18023,19735,19408,21512,15971,14966,15440,15159,17077,16079,15957,17278,17226,20608,25699,20379
+104,20421,20315,27216,19845,20821,18110,21191,21668,21193,16920,15505,15856,15183,16840,16521,14267,17312,15249,21396,24313,19081
+105,21086,20730,28476,20739,21798,18782,20665,21099,21462,17755,16544,17032,15535,17590,18151,16668,18459,17660,22152,26749,20361
+106,22032,22136,29245,21684,23125,19142,21597,21941,24864,17681,15844,17409,17061,18667,18891,17171,19699,17138,22826,27293,20730
+107,22168,22419,28550,23049,23267,19536,21674,21174,24784,17965,15929,16637,17449,18272,18952,17810,19507,17411,21801,26925,20861
+108,22881,22755,30981,22147,24281,20114,22942,21707,24391,18057,17342,17184,18114,18046,18372,17457,20041,18883,22324,26703,21417
+109,23262,23061,30713,22537,24187,21019,23159,21383,26661,18739,17794,18874,18270,19531,19964,18825,19300,19740,22628,26455,21656
+110,23513,23021,32305,23422,24775,20745,23200,22412,27344,18723,17704,17579,18892,18778,20192,19800,20445,19779,23151,27149,23365
+111,24574,24663,33730,24187,25666,21704,25270,22644,25336,19873,18084,18918,19092,18750,20980,19444,20241,20303,23076,29495,23173