Update pages/Life_cycle_of_ML.py

pages/Life_cycle_of_ML.py

@@ -1,51 +1,81 @@
 import streamlit as st
+
+# HTML content inside a string for correct syntax
 html_content = """
 # Life Cycle of ML
 
-The life cycle of Machine Learning (ML) involves several stages, from defining the problem to deploying the model. Here's an overview of each stage:
+The life cycle of Machine Learning (ML) involves several stages, from defining the problem to deploying and monitoring the model. Here's an overview of each stage:
 
-1. **Problem Definition:** Understanding the problem to define the goals and objectives of the ML model.
-2. **Data Collection:** Gathering relevant data required to train the model.
-3. **Data Preprocessing:** Cleaning and transforming the data into a usable format.
-4. **Model Building:** Building and training machine learning models using the processed data.
-5. **Evaluation:** Evaluating the performance of the model and adjusting it as needed.
-6. **Deployment:** Deploying the model into a production environment.
+1. **Problem Statement:** Understanding the problem and setting objectives for the ML model.
+2. **Data Collection:** Gathering relevant data for model training.
+3. **Simple EDA (Exploratory Data Analysis):** Initial analysis to understand the dataset's basic properties.
+4. **Data Preprocessing:** Cleaning the data to ensure it's in a usable format.
+5. **EDA (Exploratory Data Analysis):** Deeper analysis to gain insights and find patterns in the data.
+6. **Feature Engineering:** Creating new features or modifying existing ones to improve model performance.
+7. **Training:** Training machine learning models using the processed data.
+8. **Testing:** Evaluating the trained model using a test set to assess its performance.
+9. **Deploying:** Deploying the model to a production environment.
+10. **Monitoring:** Continuously monitoring the model's performance in the production environment.
 
 ---
 
-## ML Life Cycle
+## Shapes Representing the ML Life Cycle
 
-<svg width="600" height="300">
-  <!-- Problem Definition (Rectangle) -->
+<svg width="800" height="600">
+  <!-- Problem Statement (Rectangle) -->
   <rect x="50" y="50" width="150" height="50" fill="#FFB6C1" stroke="#000" />
-  <text x="75" y="80" fill="#000" font-size="14">Problem Definition</text>
+  <text x="75" y="80" fill="#000" font-size="14">Problem Statement</text>
   
   <!-- Data Collection (Circle) -->
   <circle cx="300" cy="75" r="40" fill="#ADD8E6" stroke="#000" />
   <text x="270" y="80" fill="#000" font-size="14">Data Collection</text>
   
-  <!-- Data Preprocessing (Ellipse) -->
+  <!-- Simple EDA (Ellipse) -->
   <ellipse cx="500" cy="75" rx="80" ry="40" fill="#90EE90" stroke="#000" />
-  <text x="445" y="80" fill="#000" font-size="14">Data Preprocessing</text>
+  <text x="445" y="80" fill="#000" font-size="14">Simple EDA</text>
   
-  <!-- Arrows between Problem Definition and Data Collection -->
+  <!-- Arrows between Problem Statement, Data Collection, and Simple EDA -->
   <line x1="200" y1="75" x2="260" y2="75" stroke="#000" marker-end="url(#arrow)" />
+  <line x1="380" y1="75" x2="460" y2="75" stroke="#000" marker-end="url(#arrow)" />
   
-  <!-- Model Building (Rectangle) -->
+  <!-- Data Preprocessing (Rectangle) -->
   <rect x="50" y="200" width="150" height="50" fill="#FFD700" stroke="#000" />
-  <text x="75" y="230" fill="#000" font-size="14">Model Building</text>
+  <text x="75" y="230" fill="#000" font-size="14">Data Preprocessing</text>
   
-  <!-- Evaluation (Circle) -->
+  <!-- EDA (Circle) -->
   <circle cx="300" cy="225" r="40" fill="#FF7F50" stroke="#000" />
-  <text x="275" y="230" fill="#000" font-size="14">Evaluation</text>
+  <text x="275" y="230" fill="#000" font-size="14">EDA</text>
   
-  <!-- Deployment (Rectangle) -->
-  <rect x="450" y="200" width="150" height="50" fill="#9370DB" stroke="#000" />
-  <text x="475" y="230" fill="#000" font-size="14">Deployment</text>
+  <!-- Feature Engineering (Ellipse) -->
+  <ellipse cx="500" cy="225" rx="80" ry="40" fill="#9370DB" stroke="#000" />
+  <text x="445" y="230" fill="#000" font-size="14">Feature Engineering</text>
   
-  <!-- Arrows between Model Building, Evaluation, and Deployment -->
+  <!-- Arrows between Data Preprocessing, EDA, and Feature Engineering -->
   <line x1="125" y1="250" x2="260" y2="225" stroke="#000" marker-end="url(#arrow)" />
-  <line x1="340" y1="225" x2="450" y2="225" stroke="#000" marker-end="url(#arrow)" />
+  <line x1="380" y1="225" x2="460" y2="225" stroke="#000" marker-end="url(#arrow)" />
+  
+  <!-- Training (Rectangle) -->
+  <rect x="50" y="350" width="150" height="50" fill="#FF6347" stroke="#000" />
+  <text x="75" y="380" fill="#000" font-size="14">Training</text>
+  
+  <!-- Testing (Circle) -->
+  <circle cx="300" cy="375" r="40" fill="#98FB98" stroke="#000" />
+  <text x="275" y="380" fill="#000" font-size="14">Testing</text>
+  
+  <!-- Deploying (Ellipse) -->
+  <ellipse cx="500" cy="375" rx="80" ry="40" fill="#F0E68C" stroke="#000" />
+  <text x="445" y="380" fill="#000" font-size="14">Deploying</text>
+  
+  <!-- Arrows between Training, Testing, and Deploying -->
+  <line x1="125" y1="400" x2="260" y2="375" stroke="#000" marker-end="url(#arrow)" />
+  <line x1="380" y1="375" x2="460" y2="375" stroke="#000" marker-end="url(#arrow)" />
+  
+  <!-- Monitoring (Rectangle) -->
+  <rect x="250" y="500" width="150" height="50" fill="#B0E0E6" stroke="#000" />
+  <text x="275" y="530" fill="#000" font-size="14">Monitoring</text>
+  
+  <!-- Arrow from Deploying to Monitoring -->
+  <line x1="580" y1="375" x2="325" y2="500" stroke="#000" marker-end="url(#arrow)" />
   
   <!-- Define arrow marker -->
   <defs>