Update app.py

app.py

@@ -1,87 +1,160 @@
 import streamlit as st
-import pandas as pd
-from sklearn.datasets import load_iris
-from sklearn.model_selection import train_test_split
-from sklearn.tree import DecisionTreeClassifier, plot_tree
-from sklearn.preprocessing import StandardScaler
-from sklearn.metrics import classification_report, accuracy_score
-import matplotlib.pyplot as plt
 
-st.set_page_config(page_title="Explore Decision Tree Algorithm", layout="wide")
-st.title("🌳 Decision Tree Classifier Demystified")
+# Set page configuration
+st.set_page_config(page_title="Decision Tree Theory", layout="wide")
 
+# Custom CSS styling
 st.markdown("""
-## 🧠 What is a Decision Tree?
-
-A Decision Tree is a flowchart-like tree structure where each internal node represents a test on a feature,
-each branch represents an outcome of that test, and each leaf node represents a class label.
-
-Think of it like *20 Questions*, but for data.
-
----
-## ⚙️ How Decision Trees Work
-
-1. Split the dataset based on feature values.
-2. Choose the best feature using criteria like *Gini Index, **Entropy, or **Information Gain*.
-3. Repeat recursively until leaf nodes are pure or max depth is reached.
-
-Decision Trees are:
-- Easy to understand and interpret
-- Able to handle both numerical and categorical data
-- Prone to overfitting if not pruned
-
----
+    <style>
+        .stApp {
+            background-color: #4A90E2;
+        }
+        h1, h2, h3 {
+            color: #003366;
+        }
+        .custom-font, p {
+            font-family: 'Arial', sans-serif;
+            font-size: 18px;
+            color: white;
+            line-height: 1.6;
+        }
+    </style>
+    """, unsafe_allow_html=True)
+
+# Title
+st.markdown("<h1 style='color: #003366;'>Understanding Decision Trees</h1>", unsafe_allow_html=True)
+
+# Introduction
+st.markdown("""
+    A **Decision Tree** is a versatile supervised learning algorithm used for both **classification** and **regression** tasks. It mimics human decision-making by using a tree-like model of decisions and their possible consequences.
+    
+    The basic structure includes:
+    - **Root Node**: Represents the complete dataset.
+    - **Internal Nodes**: Represent conditions on features.
+    - **Leaf Nodes**: Represent outcomes or predictions.
+    
+    Think of it as a flowchart where each internal node asks a question, and each branch represents the outcome, eventually leading to a final decision.
+""", unsafe_allow_html=True)
+
+# Entropy
+st.markdown("<h2 style='color: #003366;'>Entropy: Quantifying Uncertainty</h2>", unsafe_allow_html=True)
+st.markdown("""
+    **Entropy** measures the amount of randomness or disorder in the data. It’s commonly used in classification problems to decide how informative a feature is.
+    
+    Entropy formula:
 """)
-
-st.subheader("🌼 Try Decision Tree on the Iris Dataset")
-
-iris = load_iris()
-df = pd.DataFrame(iris.data, columns=iris.feature_names)
-df['target'] = iris.target
-
-st.dataframe(df.head(), use_container_width=True)
-
-criterion = st.radio("Select the Splitting Criterion", ["gini", "entropy"])
-max_depth = st.slider("Select Max Depth of Tree", 1, 10, value=3)
-
-X = df.drop('target', axis=1)
-y = df['target']
-
-# Standardize features
-scaler = StandardScaler()
-X_scaled = scaler.fit_transform(X)
-
-X_train, X_test, y_train, y_test = train_test_split(X_scaled, y, test_size=0.2, random_state=42)
-
-model = DecisionTreeClassifier(criterion=criterion, max_depth=max_depth, random_state=42)
-model.fit(X_train, y_train)
-y_pred = model.predict(X_test)
-
-acc = accuracy_score(y_test, y_pred)
-st.success(f"✅ Model Accuracy: {acc*100:.2f}%")
-
-st.markdown("### 📊 Classification Report")
-st.text(classification_report(y_test, y_pred, target_names=iris.target_names))
-
-st.markdown("### 🌳 Visualizing the Decision Tree")
-fig, ax = plt.subplots(figsize=(10, 6))
-plot_tree(model, filled=True, feature_names=iris.feature_names, class_names=iris.target_names, fontsize=10)
-st.pyplot(fig)
-
+st.image("entropy-formula-2.jpg", width=300)
 st.markdown("""
----
-## 💡 Highlights of Decision Trees:
-- Visual and easy to explain.
-- No need for feature scaling.
-- Can model non-linear relationships.
-- Can easily overfit — use pruning or set max depth.
-
-## 🔧 When to Use Decision Trees?
-Use them when:
-- You need a quick, explainable model.
-- Feature relationships are non-linear.
-- Interpretability is more important than performance.
+    Where:
+    - \( p(i) \) is the probability of class \( i \).
+    
+    **Example**:
+    - If \( P(Yes) = 0.5 \), \( P(No) = 0.5 \),
+    
+    Then:
+    $$ H(Y) = - (0.5 \cdot \log_2(0.5) + 0.5 \cdot \log_2(0.5)) = 1 $$
+    
+    This indicates maximum uncertainty (perfectly balanced classes).
+""", unsafe_allow_html=True)
+
+# Gini Impurity
+st.markdown("<h2 style='color: #003366;'>Gini Impurity: Measuring Impurity</h2>", unsafe_allow_html=True)
+st.markdown("""
+    **Gini Impurity** is another popular impurity measure. It calculates how often a randomly chosen element would be incorrectly labeled.
+    
+    Formula:
+""")
+st.image("gini.png", width=300)
+st.markdown("""
+    **Example**:
+    - \( P(Yes) = 0.5 \), \( P(No) = 0.5 \)
+    
+    Then:
+    $$ Gini(Y) = 1 - (0.5^2 + 0.5^2) = 0.5 $$
+    
+    A lower Gini value means purer splits.
+""", unsafe_allow_html=True)
+
+# Tree Construction
+st.markdown("<h2 style='color: #003366;'>Building the Decision Tree</h2>", unsafe_allow_html=True)
+st.markdown("""
+    Decision Trees are built **top-down**, starting from the root. At each node, the algorithm selects the feature that best splits the data using metrics like **Entropy** or **Gini**.
+    
+    Splitting stops when:
+    - The data is pure (contains one class), or
+    - A stopping condition is met (like maximum depth).
+""", unsafe_allow_html=True)
+
+# Iris Tree Visualization
+st.markdown("<h2 style='color: #003366;'>Visualizing: Iris Dataset Tree</h2>", unsafe_allow_html=True)
+st.markdown("""
+    Here's an example decision tree trained on the famous **Iris dataset**, which classifies flower species based on petal and sepal measurements.
+""", unsafe_allow_html=True)
+st.image("dt1 (1).jpg", caption="Decision Tree for Iris Dataset", use_container_width=True)
 
----
-🎯 *Tip:* Watch out for overfitting. Decision Trees love to memorize the training data if left unchecked.
-""")
+# Training & Testing - Classification
+st.markdown("<h2 style='color: #003366;'>Training & Testing (Classification)</h2>", unsafe_allow_html=True)
+st.markdown("""
+    **Training**:
+    - Select features and split based on impurity reduction.
+    - Recursively grow the tree until stopping criteria are met.
+    
+    **Testing**:
+    - Traverse the tree with new data.
+    - Follow the decision rules until you reach a leaf node (prediction).
+    
+    💡 *Example: For Iris, classify the flower as Setosa, Versicolor, or Virginica based on petal dimensions.*
+""", unsafe_allow_html=True)
+
+# Training & Testing - Regression
+st.markdown("<h2 style='color: #003366;'>Training & Testing (Regression)</h2>", unsafe_allow_html=True)
+st.markdown("""
+    **Training**:
+    - Split data to minimize **Mean Squared Error (MSE)**.
+    
+    **Testing**:
+    - Output the mean value in the corresponding leaf.
+    
+    💡 *Example: Predict house price using features like size, location, and number of rooms.*
+""", unsafe_allow_html=True)
+
+# Pre-Pruning
+st.markdown("<h2 style='color: #003366;'>Pre-Pruning: Control Overfitting Early</h2>", unsafe_allow_html=True)
+st.markdown("""
+    Pre-pruning stops the tree from growing too deep and complex. Common techniques include:
+    
+    - **Max Depth**
+    - **Min Samples Split**
+    - **Min Samples Leaf**
+    - **Max Features**
+    
+    These help in generalizing better and reducing noise.
+""", unsafe_allow_html=True)
+
+# Post-Pruning
+st.markdown("<h2 style='color: #003366;'>Post-Pruning: Simplify After Growth</h2>", unsafe_allow_html=True)
+st.markdown("""
+    In **post-pruning**, we allow the tree to grow fully, then trim unnecessary branches:
+    
+    - **Cost Complexity Pruning**
+    - **Validation-based Pruning**
+    
+    This helps reduce overfitting and improves model simplicity.
+""", unsafe_allow_html=True)
+
+# Feature Importance
+st.markdown("<h2 style='color: #003366;'>Feature Selection with Decision Trees</h2>", unsafe_allow_html=True)
+st.markdown("""
+    Decision Trees provide insight into which features are most important based on how often and how effectively they split data.
+""")
+st.image("feature.png", width=500)
+st.markdown("""
+    💡 *Higher importance → More influential in decision making.*
+""", unsafe_allow_html=True)
+
+# Notebook Link
+st.markdown("<h2 style='color: #003366;'>Explore Hands-On Implementation</h2>", unsafe_allow_html=True)
+st.markdown(
+    "<a href='https://colab.research.google.com/drive/1SqZ5I5h7ivS6SJDwlOZQ-V4IAOg90RE7?usp=sharing' target='_blank' style='font-size: 16px; color: #003366;'>🔗 Open Jupyter Notebook on Google Colab</a>",
+    unsafe_allow_html=True
+)