ESMATUGBA commited on
Commit
70d855c
·
verified ·
1 Parent(s): a4deb7f

Update src/streamlit_app.py

Browse files
Files changed (1) hide show
  1. src/streamlit_app.py +67 -49
src/streamlit_app.py CHANGED
@@ -2,45 +2,58 @@ import streamlit as st
2
  import pandas as pd
3
  import plotly.express as px
4
  import plotly.graph_objects as go
 
5
 
6
  # 1. SAYFA AYARLARI VE ÖZEL TASARIM (CSS)
7
  st.set_page_config(layout="wide", page_title="Gold Intelligence Dashboard")
8
 
9
- # Beyaz Tema CSS Kodları - Siyahı Bitiren Kısım
10
  st.markdown("""
11
  <style>
12
- /* Ana Arka Planı Bembeyaz Yapalım */
13
  .stApp {
14
- background-color: #FFFFFF;
15
  }
16
 
17
- /* Tüm Yazıların Siyah ve Net Olmasını Sağlayalım */
18
- h1, h2, h3, h4, p, span, div {
19
- color: #1A1A1A !important;
20
  }
21
 
22
  /* Ana Başlığı Altın Sarısı Yapalım */
23
  h1.main-title {
24
- color: #D4AF37 !important; /* Premium Gold */
25
- text-shadow: 1px 1px 2px rgba(0,0,0,0.1);
26
  }
27
 
28
- /* Metrik Kartlarını Şıklaştıralım */
29
  [data-testid="stMetricValue"] {
30
- color: #B28F2D !important; /* Biraz daha koyu altın sarısı */
 
 
 
31
  }
32
 
33
- /* Grafikleri Çevreleyen Beyaz Alanlar */
 
 
 
 
 
 
 
34
  .plot-container {
35
- background-color: #FDFDFD;
36
  border-radius: 8px;
37
- box-shadow: 0 4px 6px rgba(0,0,0,0.05);
38
  padding: 10px;
 
39
  }
40
-
41
- /* Yan Panelin Beyazlığı */
42
  .css-163utfM, .css-hxt7ib {
43
- background-color: #F8F9FA !important;
 
44
  }
45
 
46
  </style>
@@ -62,47 +75,47 @@ except Exception as e:
62
  st.error(f"Veri yükleme hatası: {e}")
63
  st.stop()
64
 
65
- # 3. SIDEBAR (SOL PANEL - BEYAZ)
66
- st.sidebar.markdown("<h2 style='color: #D4AF37;'>📅 Filtreler</h2>", unsafe_allow_html=True)
67
  years_list = sorted([y for y in df['YEAR'].unique() if y >= 2008])
68
  year = st.sidebar.selectbox("Yıl Seçin / Select Year", options=years_list, index=0)
69
 
70
  filtered_df = df[df['YEAR'] == year].copy()
71
 
72
  # 4. ANA BAŞLIK
73
- st.markdown("<h1 class='main-title' style='text-align: center; font-size: 48px;'>💰 Gold Price Intelligence</h1>", unsafe_allow_html=True)
74
- st.markdown("<p style='text-align: center; color: #4A4A4A; font-size: 18px;'>Altın Fiyat Analizi ve Stratejik Öngörü Paneli</p>", unsafe_allow_html=True)
 
75
  st.divider()
76
 
77
- # METRİK KARTLARI
78
  m1, m2, m3 = st.columns(3)
79
  with m1:
 
80
  current_price = filtered_df['GLD'].iloc[-1]
81
- st.metric(label="Son Kapanış Fiyatı", value=f"{current_price:.2f}")
82
  with m2:
83
- st.metric(label=f"{year} Tepe Noktası", value=f"{filtered_df['GLD'].max():.2f}")
84
  with m3:
85
- st.metric(label=f"{year} Dip Noktası", value=f"{filtered_df['GLD'].min():.2f}")
86
 
87
  st.divider()
88
 
89
- # 5. YÖNETİCİ BİLGİ NOTU (BEYAZ TEMA İÇİN YUMUŞATILMIŞ)
90
  st.markdown("## 💼 Yönetici Bilgi Notu / Executive Summary")
91
  info_col1, info_col2 = st.columns(2)
92
 
93
  if year == 2008:
94
  tr_text = "🇹🇷 2008'de altın güvenli limandır, alım faydalıdır."
95
  us_text = "🇺🇸 Gold is a safe haven in 2008; buying is beneficial."
96
- box_color = "#FFF8E1" # Çok açık altın sarısı kutu
97
- border_color = "#D4AF37" # Altın sarısı çizgi
98
  else:
99
  tr_text = f"🇹🇷 {year} yılı verileri istikrarlı görünüyor. Teknik analiz önerilir."
100
  us_text = f"🇺🇸 Data for {year} appears stable. Technical analysis recommended."
101
- box_color = "#E8F5E9" # Çok açık yeşil kutu
102
  border_color = "#28A745" # Yeşil çizgi
103
 
104
- tr_msg = f"<div style='background-color: {box_color}; padding: 25px; border-left: 6px solid {border_color}; border-radius: 8px;'> <h3 style='margin:0;'>{tr_text}</h3> </div>"
105
- us_msg = f"<div style='background-color: {box_color}; padding: 25px; border-left: 6px solid {border_color}; border-radius: 8px;'> <h3 style='margin:0;'>{us_text}</h3> </div>"
106
 
107
  with info_col1:
108
  st.markdown(tr_msg, unsafe_allow_html=True)
@@ -111,52 +124,57 @@ with info_col2:
111
 
112
  st.divider()
113
 
114
- # 6. GRAFİKLER (PLOTLY - LIGHT TEMA İLE TİTREMESİZ VE NET)
115
  st.markdown(f"## 📈 {year} Piyasa Hareketi / Market Action")
116
 
117
- # Ana Grafik (Plotly Go ile Alan Grafiği - Beyaz Tema)
118
  fig1 = go.Figure()
119
  fig1.add_trace(go.Scatter(x=filtered_df['Date'], y=filtered_df['GLD'],
120
  mode='lines',
121
- line=dict(color='#B28F2D', width=3), # Biraz daha koyu altın
122
- fill='tozeroy', fillcolor='rgba(212, 175, 55, 0.1)')) # Çok açık altın dolgu
123
 
124
- fig1.update_layout(template="plotly_white", height=480, # Beyaz şablon
125
- title=f"{year} Altın Fiyat Grafiği | Alan Analizi",
 
126
  xaxis_title="Tarih / Date", yaxis_title="GLD Fiyatı / Price",
127
- margin=dict(l=40, r=40, t=60, b=40),
128
- paper_bgcolor='rgba(0,0,0,0)', plot_bgcolor='rgba(0,0,0,0)')
129
- fig1.update_xaxes(showgrid=True, gridcolor='#F0F0F0') # Hafif ızgara
130
- fig1.update_yaxes(showgrid=True, gridcolor='#F0F0F0')
131
 
132
  st.plotly_chart(fig1, use_container_width=True)
133
 
134
  st.markdown(f"#### 📝 Not: Bu grafik {year} yılındaki günlük fiyat hareketlerini gösterir.")
135
  st.divider()
136
 
137
- # ALT GRAFİKLER (YAN YANA)
138
  c1, c2 = st.columns(2)
 
139
  with c1:
140
  st.markdown("### 🎯 Dağılım / Distribution")
141
- # Histogram - Beyaz Tema
142
- fig2 = px.histogram(filtered_df, x="GLD", color_discrete_sequence=['#D4AF37'], template="plotly_white")
143
- fig2.update_layout(title="Fiyat Yoğunluğu / Price Density", paper_bgcolor='rgba(0,0,0,0)', plot_bgcolor='rgba(0,0,0,0)')
144
- fig2.update_xaxes(showgrid=True, gridcolor='#F0F0F0')
 
 
145
  st.plotly_chart(fig2, use_container_width=True)
146
 
147
  with c2:
148
  st.markdown("### 🌡️ Korelasyon / Correlation")
149
- # Korelasyon Heatmap - Beyaz Tema için Renk Skalası Değişti
150
  num_df = filtered_df.select_dtypes(include=['number']).corr()
151
- fig3 = px.imshow(num_df, text_auto=True, color_continuous_scale='YlOrRd', template="plotly_white") # Sıcak renkler
152
- fig3.update_layout(title="Varlık İlişkileri / Asset Correlation", paper_bgcolor='rgba(0,0,0,0)', plot_bgcolor='rgba(0,0,0,0)')
 
153
  st.plotly_chart(fig3, use_container_width=True)
154
 
155
  st.divider()
156
 
157
  # 7. VERİ TABLOSU (Her Zaman Açık, Temiz ve Net)
158
  st.markdown("### 📋 Detaylı Veri Seti / Detailed Dataset")
159
- # Beyaz modda tablo otomatik net ve okunurdur.
160
  st.dataframe(filtered_df.head(15), use_container_width=True)
161
 
162
  csv = filtered_df.to_csv(index=False).encode('utf-8')
 
2
  import pandas as pd
3
  import plotly.express as px
4
  import plotly.graph_objects as go
5
+ import numpy as np
6
 
7
  # 1. SAYFA AYARLARI VE ÖZEL TASARIM (CSS)
8
  st.set_page_config(layout="wide", page_title="Gold Intelligence Dashboard")
9
 
10
+ # Streamlit Genel Koyu Tema ve Font Düzeltmeleri (Beyaz Yazılar)
11
  st.markdown("""
12
  <style>
13
+ /* Tüm Sayfa Arka Planı Siyah */
14
  .stApp {
15
+ background-color: #0E1117;
16
  }
17
 
18
+ /* Tüm Başlıklar ve Metinler Beyaz/Hafif Gri ve Net */
19
+ h1, h2, h3, h4, p, span, div, li, label, .stMarkdown p {
20
+ color: #F8F9FA !important;
21
  }
22
 
23
  /* Ana Başlığı Altın Sarısı Yapalım */
24
  h1.main-title {
25
+ color: #FFD700 !important;
26
+ text-shadow: 2px 2px 4px rgba(0,0,0,0.5);
27
  }
28
 
29
+ /* Metrik Değerlerini Kocaman ve Kalın Yapalım (İsteğin Üzerine) */
30
  [data-testid="stMetricValue"] {
31
+ font-size: 60px !important; /* Değeri büyüt */
32
+ font-weight: 900 !important; /* En kalın yazı */
33
+ color: #FFD700 !important; /* Altın Sarısı rakamlar */
34
+ letter-spacing: -2px; /* Harf aralarını daralt, daha şık durur */
35
  }
36
 
37
+ /* Metrik Etiketlerini (Label) de Netleştirelim */
38
+ [data-testid="stMetricLabel"] p {
39
+ font-size: 18px !important;
40
+ color: #F8F9FA !important;
41
+ margin-bottom: -10px !important;
42
+ }
43
+
44
+ /* Grafikleri Çevreleyen Siyah Alanlar */
45
  .plot-container {
46
+ background-color: #111111;
47
  border-radius: 8px;
48
+ box-shadow: 0 4px 6px rgba(0,0,0,0.2);
49
  padding: 10px;
50
+ border: 1px solid #222222; /* Hafif bir çerçeve */
51
  }
52
+
53
+ /* SideBar (Sol Panel) Koyu */
54
  .css-163utfM, .css-hxt7ib {
55
+ background-color: #0E1117 !important;
56
+ border-right: 1px solid #222222;
57
  }
58
 
59
  </style>
 
75
  st.error(f"Veri yükleme hatası: {e}")
76
  st.stop()
77
 
78
+ # 3. SIDEBAR
79
+ st.sidebar.markdown("<h2 style='color: #FFD700;'>📅 Filtreler</h2>", unsafe_allow_html=True)
80
  years_list = sorted([y for y in df['YEAR'].unique() if y >= 2008])
81
  year = st.sidebar.selectbox("Yıl Seçin / Select Year", options=years_list, index=0)
82
 
83
  filtered_df = df[df['YEAR'] == year].copy()
84
 
85
  # 4. ANA BAŞLIK
86
+ # Tam talep ettiğin başlık metni
87
+ st.markdown("<h1 class='main-title' style='text-align: center; font-size: 45px;'>💰 Gold Price Intelligence</h1>", unsafe_allow_html=True)
88
+ st.markdown("<p style='text-align: center; color: #E0E0E0;'>Altın Fiyat Analizi ve Stratejik Öngörü Paneli</p>", unsafe_allow_html=True)
89
  st.divider()
90
 
91
+ # 📈 METRİK KARTLARI (İSTEĞİN ÜZERİNE BÜYÜTÜLDÜ)
92
  m1, m2, m3 = st.columns(3)
93
  with m1:
94
+ # Son Kapanış Fiyatı (Örnek: 86.52)
95
  current_price = filtered_df['GLD'].iloc[-1]
96
+ st.metric(label="Son Kapanış Fiyatı (GLD)", value=f"{current_price:.2f}")
97
  with m2:
98
+ st.metric(label=f"{year} Tepe Noktası (Tepe)", value=f"{filtered_df['GLD'].max():.2f}")
99
  with m3:
100
+ st.metric(label=f"{year} Dip Noktası (Taban)", value=f"{filtered_df['GLD'].min():.2f}")
101
 
102
  st.divider()
103
 
104
+ # 5. YÖNETİCİ BİLGİ NOTU (OKUNAKLI)
105
  st.markdown("## 💼 Yönetici Bilgi Notu / Executive Summary")
106
  info_col1, info_col2 = st.columns(2)
107
 
108
  if year == 2008:
109
  tr_text = "🇹🇷 2008'de altın güvenli limandır, alım faydalıdır."
110
  us_text = "🇺🇸 Gold is a safe haven in 2008; buying is beneficial."
111
+ border_color = "#FFD700" # Altın sarısı çizgi
 
112
  else:
113
  tr_text = f"🇹🇷 {year} yılı verileri istikrarlı görünüyor. Teknik analiz önerilir."
114
  us_text = f"🇺🇸 Data for {year} appears stable. Technical analysis recommended."
 
115
  border_color = "#28A745" # Yeşil çizgi
116
 
117
+ tr_msg = f"<div style='background-color: #1A1D23; padding: 20px; border-left: 5px solid {border_color}; border-radius: 5px;'> <h3 style='margin:0; color: #F8F9FA;'>{tr_text}</h3> </div>"
118
+ us_msg = f"<div style='background-color: #1A1D23; padding: 20px; border-left: 5px solid {border_color}; border-radius: 5px;'> <h3 style='margin:0; color: #F8F9FA;'>{us_text}</h3> </div>"
119
 
120
  with info_col1:
121
  st.markdown(tr_msg, unsafe_allow_html=True)
 
124
 
125
  st.divider()
126
 
127
+ # 6. GRAFİKLER (EKTEKİ RENKLERDE VE TİTREMESİZ PLOTLY)
128
  st.markdown(f"## 📈 {year} Piyasa Hareketi / Market Action")
129
 
130
+ # Ana Grafik (Plotly Go ile Profesyonel Alan Grafiği - image_1.png Renkleri)
131
  fig1 = go.Figure()
132
  fig1.add_trace(go.Scatter(x=filtered_df['Date'], y=filtered_df['GLD'],
133
  mode='lines',
134
+ line=dict(color='#FFD700', width=3), # Siyah zemin üzerine net sarı
135
+ fill='tozeroy', fillcolor='rgba(255, 215, 0, 0.08)')) # Hafif dolgu
136
 
137
+ fig1.update_layout(template="plotly_dark", height=480, # Koyu şablon
138
+ paper_bgcolor='rgba(0,0,0,0)', plot_bgcolor='rgba(0,0,0,0)', # Tam şeffaf grafik içi
139
+ title=f"{year} Altın Fiyat Hareketi | Alan Analizi",
140
  xaxis_title="Tarih / Date", yaxis_title="GLD Fiyatı / Price",
141
+ margin=dict(l=20, r=20, t=60, b=20),
142
+ font=dict(color="#F8F9FA")) # Eksen yazıları beyaz
143
+ fig1.update_xaxes(showgrid=False) # X Izgarasını kapat
144
+ fig1.update_yaxes(showgrid=True, gridcolor='#222222') # Y Izgarasını çok hafif aç
145
 
146
  st.plotly_chart(fig1, use_container_width=True)
147
 
148
  st.markdown(f"#### 📝 Not: Bu grafik {year} yılındaki günlük fiyat hareketlerini gösterir.")
149
  st.divider()
150
 
151
+ # Yan Yana Grafikler
152
  c1, c2 = st.columns(2)
153
+
154
  with c1:
155
  st.markdown("### 🎯 Dağılım / Distribution")
156
+ # Histogram (image_2.png Renkleri)
157
+ fig2 = px.histogram(filtered_df, x="GLD", nbins=25,
158
+ marginal="rug", color_discrete_sequence=['#FFD700'], # Siyah zemin üzerine sarı barlar
159
+ template="plotly_dark")
160
+ fig2.update_layout(height=380, font=dict(color="#F8F9FA"), paper_bgcolor='rgba(0,0,0,0)', plot_bgcolor='rgba(0,0,0,0)')
161
+ fig2.update_xaxes(title="GLD Fiyatı", showgrid=False)
162
  st.plotly_chart(fig2, use_container_width=True)
163
 
164
  with c2:
165
  st.markdown("### 🌡️ Korelasyon / Correlation")
166
+ # Heatmap (image_3.png Renkleri)
167
  num_df = filtered_df.select_dtypes(include=['number']).corr()
168
+ fig3 = px.imshow(num_df, text_auto=True, color_continuous_scale='YlOrRd', # Sarı-Turuncu-Kırmızı
169
+ template="plotly_dark")
170
+ fig3.update_layout(height=380, font=dict(color="#F8F9FA"), paper_bgcolor='rgba(0,0,0,0)', plot_bgcolor='rgba(0,0,0,0)')
171
  st.plotly_chart(fig3, use_container_width=True)
172
 
173
  st.divider()
174
 
175
  # 7. VERİ TABLOSU (Her Zaman Açık, Temiz ve Net)
176
  st.markdown("### 📋 Detaylı Veri Seti / Detailed Dataset")
177
+ # Siyah modda tablo verileri otomatik beyaz ve net okunur.
178
  st.dataframe(filtered_df.head(15), use_container_width=True)
179
 
180
  csv = filtered_df.to_csv(index=False).encode('utf-8')