Update app.py

app.py

@@ -5,6 +5,7 @@ import streamlit as st
 import time
 import matplotlib.font_manager as fm
 import matplotlib as mpl
+from io import StringIO
 
 # Download and set custom font
 font_url = "https://drive.google.com/uc?id=1eGAsTN1HBpJAkeVM57_C7ccp7hbgSz3_&export=download"
@@ -17,11 +18,10 @@ fm.fontManager.addfont("TaipeiSansTCBeta-Regular.ttf")
 mpl.rc('font', family='Taipei Sans TC Beta')
 
 # Function to download and load CSV into a DataFrame
-def download_csv(url, filename):
+@st.cache_data  # Add caching to improve performance
+def download_csv(url):
     response = requests.get(url)
-    with open(filename, "wb") as file:
-        file.write(response.content)
-    df = pd.read_csv(filename)
+    df = pd.read_csv(StringIO(response.text))
     df = df.fillna(0)  # Fill missing values with 0
     return df
 
@@ -32,44 +32,78 @@ urls = {
     "董事會": "https://mopsfin.twse.com.tw/opendata/t187ap46_L_6.csv"   # Board of Directors
 }
 
-# Filenames to save CSV data
-filenames = {
-    "溫室氣體": "data01.csv",
-    "再生能源": "data02.csv",
-    "董事會": "data03.csv"
-}
+# Set page config for a wider layout
+st.set_page_config(layout="wide", page_title="ESG Data Visualization")
 
-# Streamlit app title
-st.title("ESG Data Visualization with Streamlit")
+# Streamlit app title with custom styling
+st.markdown("""
+    <style>
+    .big-font {
+        font-size:50px !important;
+        color: #1E88E5;
+        font-family: 'Taipei Sans TC Beta';
+    }
+    </style>
+    """, unsafe_allow_html=True)
+st.markdown('<p class="big-font">ESG Data Visualization</p>', unsafe_allow_html=True)
 
-# Dropdown menu for data selection
-selected_option = st.selectbox("選擇資料類型", options=list(urls.keys()))
+# Sidebar for data selection and chart options
+st.sidebar.header("設置")
+selected_option = st.sidebar.selectbox("選擇資料類型", options=list(urls.keys()))
+chart_type = st.sidebar.radio("選擇圖表類型", ("圓餅圖", "柱狀圖", "折線圖"))
 
-# Button to load data
-if st.button("載入資料"):
+# Main content area
+if st.sidebar.button("載入資料"):
     with st.spinner('資料載入中...'):
-        # Simulate a delay for the process bar
-        for _ in range(5):
-            time.sleep(0.2)
-        df = download_csv(urls[selected_option], filenames[selected_option])
+        # Add a progress bar
+        progress_bar = st.progress(0)
+        for i in range(100):
+            time.sleep(0.01)
+            progress_bar.progress(i + 1)
+        
+        df = download_csv(urls[selected_option])
     
-    # Displaying the DataFrame
+    # Displaying the DataFrame with styling
     st.header(f"{selected_option} 資料")
-    st.dataframe(df)
-
-    # Column selection for visualization
-    x_col = st.selectbox("選擇類別欄位 (X 軸)", options=df.columns)
-    y_col = st.selectbox("選擇數值欄位 (Y 軸)", options=df.columns)
-
-    # Chart type selection
-    chart_type = st.radio("選擇圖表類型", ("圓餅圖", "柱狀圖"))
-
-    # Plotting the data based on user selection
+    st.dataframe(df.style.highlight_max(axis=0))
+    
+    # Data summary
+    st.subheader("資料摘要")
+    col1, col2 = st.columns(2)
+    with col1:
+        st.write(df.describe())
+    with col2:
+        st.write(df.info())
+    
+    # Visualization
+    st.subheader("資料視覺化")
     if chart_type == "圓餅圖":
-        fig = px.pie(df, names=x_col, values=y_col, title=f"Pie Chart for {selected_option}")
+        fig = px.pie(df, names=df.columns[0], values=df.columns[1], title=f"{selected_option} 分佈")
     elif chart_type == "柱狀圖":
-        fig = px.bar(df, x=x_col, y=y_col, title=f"Bar Chart for {selected_option}")
+        fig = px.bar(df, x=df.columns[0], y=df.columns[1], title=f"{selected_option} 比較")
+    else:  # 折線圖
+        fig = px.line(df, x=df.columns[0], y=df.columns[1], title=f"{selected_option} 趨勢")
+    
+    # Apply custom font and styling to the plot
+    fig.update_layout(
+        font_family="Taipei Sans TC Beta",
+        title_font_size=24,
+        legend_title_font_size=14,
+        legend_font_size=12
+    )
+    
+    # Display the chart
+    st.plotly_chart(fig, use_container_width=True)
+    
+    # Add download button for the data
+    csv = df.to_csv(index=False)
+    st.download_button(
+        label="下載資料為 CSV",
+        data=csv,
+        file_name=f"{selected_option}_data.csv",
+        mime="text/csv",
+    )
 
-    # Apply custom font to the plot
-    fig.update_layout(font_family="Taipei Sans TC Beta")
-    st.plotly_chart(fig)
+# Footer
+st.markdown("---")
+st.markdown("Created with ❤️ using Streamlit")