Upload 2 files

app.py

@@ -7,6 +7,9 @@ from sklearn import datasets
 from sklearn.preprocessing import StandardScaler
 from sklearn.decomposition import PCA
 
+# ======================
+# Labels (NL) voor features
+# ======================
 FEATURE_LABELS = {
     "age": "Leeftijd",
     "sex": "Geslacht",
@@ -22,14 +25,46 @@ FEATURE_LABELS = {
 }
 LABEL_TO_KEY = {v: k for k, v in FEATURE_LABELS.items()}
 
+# ======================
+# Medisch nut (bovenaan) + speels blok
+# ======================
+MEDICAL_MD = r"""
+### Medisch nut  
+
+**Wat zien we hier?**  
+Ik heb een bestaande, anonieme gezondheidsdataset gebruikt die speciaal beschikbaar is gemaakt voor onderzoek en studie. In deze gegevens staan metingen van een grote groep patiënten, zoals **bloedwaarden, BMI, cholesterol en bloedsuiker**.  
+
+Zo’n enorme berg cijfers is voor artsen en ziekenhuizen bijna niet in één keer te overzien. Het is gewoon te veel om met het blote oog patronen uit te halen.  
+
+**Daar komt kunstmatige intelligentie om de hoek kijken.**  
+Met deze techniek (PCA) kan de computer de data slim samenvatten en patronen zichtbaar maken. Dit programma dat ik heb ontworpen laat live zien hoe die samenvatting werkt.  
+
+- Elke punt is één patiënt.  
+- De kleur laat zien hoe hoog of laag een bepaalde meting is (standaard: BMI).  
+- De pijlen laten zien welke metingen het meeste invloed hebben.  
+- Links bovenin kun je kiezen welke meting je als uitgangspunt wilt nemen.  
+
+**En wat heb je hieraan?**  
+In de praktijk gebruiken artsen en onderzoekers zo’n plot om patronen en verbanden te ontdekken. 👉 Het is dus niet alleen een mooi plaatje, maar echt een manier om grote hoeveelheden data sneller en slimmer te begrijpen.  
+
+Met AI kunnen we patronen vinden die je met het blote oog nooit zou zien. Dat maakt dit niet alleen een mooie visualisatie, maar ook een knap stukje technologie met échte waarde voor onderzoek en zorg.  
+
+**Speel zelf de onderzoeker!**  
+Doe alsof je een arts bent en kies links bovenin een waarde, bijvoorbeeld **cholesterol**, **leeftijd** of **geslacht**. Klik daarna op *Update visualisaties* en ontdek je eigen patronen in de data.  
+"""
+
+# ======================
+# Data
+# ======================
 def load_diabetes_df():
     d = datasets.load_diabetes()
-    X = pd.DataFrame(d.data, columns=d.feature_names)
+    X = pd.DataFrame(d.data, columns=d.feature_names)  # standardized features
     y = pd.Series(d.target, name="target")
     df = X.copy()
     df["target"] = y
     return df
 
+# Overzichtstabel (gemiddelde & % boven/onder mean)
 def compute_overview_table(df: pd.DataFrame):
     keys = ["bmi","bp","s1","s2","s3","s4","s5","s6"]
     rows = []
@@ -38,7 +73,7 @@ def compute_overview_table(df: pd.DataFrame):
         if vals.size == 0:
             continue
         mean = float(vals.mean())
-        pct_above = float((vals > 0).mean() * 100.0)  # standardized: 0 ~ mean
+        pct_above = float((vals > 0).mean() * 100.0)  # standardised: 0 ≈ overall mean
         pct_below = float((vals < 0).mean() * 100.0)
         rows.append({
             "Meting": FEATURE_LABELS.get(k, k),
@@ -54,9 +89,13 @@ def compute_overview_table(df: pd.DataFrame):
     )
     return table, note
 
+# ======================
+# Kern: PCA biplot
+# ======================
 def pca_biplot(color_label="BMI (Body Mass Index)", arrow_scale=2.0, point_size=32, alpha=0.85, n_components=10, standardize=True):
     df = load_diabetes_df()
     overview_df, overview_note = compute_overview_table(df)
+
     feature_keys = [c for c in df.columns if c != "target"]
     color_key = LABEL_TO_KEY.get(color_label, "bmi")
 
@@ -74,6 +113,7 @@ def pca_biplot(color_label="BMI (Body Mass Index)", arrow_scale=2.0, point_size=
 
     cvals = df[color_key].values
 
+    # Plot 1: Biplot
     fig1 = plt.figure(figsize=(7.8, 5.6))
     ax = fig1.add_subplot(111)
     sc = ax.scatter(Z[:, 0], Z[:, 1], c=cvals, s=point_size, alpha=alpha)
@@ -94,6 +134,7 @@ def pca_biplot(color_label="BMI (Body Mass Index)", arrow_scale=2.0, point_size=
     ax.grid(True, linestyle=":", linewidth=0.6)
     plt.tight_layout()
 
+    # Plot 2: Explained variance
     fig2 = plt.figure(figsize=(7.8, 3.8))
     ax2 = fig2.add_subplot(111)
     xs = np.arange(1, len(expl) + 1)
@@ -106,6 +147,7 @@ def pca_biplot(color_label="BMI (Body Mass Index)", arrow_scale=2.0, point_size=
     ax2.grid(True, linestyle=":", linewidth=0.6)
     plt.tight_layout()
 
+    # Tabel: top-features PC1/PC2
     load_df = pd.DataFrame({
         "feature_key": feature_keys,
         "PC1_loading": loadings[:, 0],
@@ -134,8 +176,20 @@ def pca_biplot(color_label="BMI (Body Mass Index)", arrow_scale=2.0, point_size=
 
     return fig1, fig2, table, summary_md, overview_df, overview_note
 
+# ======================
+# UI
+# ======================
 with gr.Blocks(title="PCA Biplot — Diabetes (NL labels)") as demo:
+    # Klein beetje stijl voor de tip-callout
+    gr.HTML("""
+    <style>
+      .callout {padding:12px 14px; border-left:4px solid #2563eb; background:#f1f5f9; border-radius:6px; margin: 8px 0 18px;}
+      .smallnote {font-size: 0.92em; opacity: 0.85;}
+    </style>
+    """)
+
     gr.Markdown("# PCA Biplot — Diabetes (NL labels)")
+    gr.Markdown(MEDICAL_MD)
 
     with gr.Row():
         with gr.Column(scale=1):
@@ -147,6 +201,7 @@ with gr.Blocks(title="PCA Biplot — Diabetes (NL labels)") as demo:
             n_components = gr.Slider(2, 10, value=10, step=1, label="Aantal PCA-componenten (voor variatieplot)")
             standardize = gr.Checkbox(value=True, label="Standaardiseer metingen (aanbevolen)")
             run_btn = gr.Button("Update visualisaties")
+            gr.HTML('<div class="callout smallnote">💡 *Tip:* kies links een meting (bijv. BMI of cholesterol) en klik daarna op <b>Update visualisaties</b>.</div>')
         with gr.Column(scale=2):
             plot_biplot = gr.Plot(label="PCA-biplot — punten + pijlen")
             plot_expl = gr.Plot(label="Uitlegvariantie per component")