Update pages/Data Collection.py

pages/Data Collection.py

@@ -1,7 +1,7 @@
 import streamlit as st
-import pandas as pd
 import numpy as np
 import matplotlib.pyplot as plt
+import pandas as pd
 
 
 st.set_page_config(
@@ -261,8 +261,6 @@ elif st.session_state.current_page == "explore_excel":
     if st.button("Go Back"):
         navigate_to("main")
 
-
-
 elif st.session_state.current_page == "explore_images_video":
     st.markdown("""
         <h2 style="color: #BB3385;">Introduction to Images and Videos📸🖼️</h2>
@@ -276,7 +274,6 @@ elif st.session_state.current_page == "explore_images_video":
                 An image is a two-dimensional representation of the visible light spectrum, often captured 
                 using devices like cameras or scanners. It can store details such as colors, shapes, and textures, 
                 enabling us to visually interpret and analyze information. 
-                
                 Common formats include JPEG, PNG, and BMP.
             </p>
         </div>
@@ -290,7 +287,6 @@ elif st.session_state.current_page == "explore_images_video":
                 A video is a collection of images, often referred to as frames, displayed one after another quickly 
                 to show continuous movement. Each frame captures a moment in time, and when these frames are played 
                 sequentially, they show continuous movement. 
-                
                 Videos typically have a frame rate (e.g., 30 frames 
                 per second or 60 frames per second), which determines how many frames are displayed per second. 
                 Common video formats include MP4, AVI, and MOV.
@@ -306,9 +302,7 @@ elif st.session_state.current_page == "explore_images_video":
                 Images are called **grid-like structures** because they are composed of **pixels** arranged in rows and columns, 
                 forming a rectangular grid. Each pixel contains information about **shape**, **color**, and **patterns**, which 
                 together define the image's content. 
-                
-                The total number of pixels is determined by the image's height 
-                and width (resolution), and a higher resolution provides better clarity.
+                The total number of pixels is determined by the image's height and width (resolution), and a higher resolution provides better clarity.
             </p>
             <p style="font-size: 16px; color: #333;">
                 In images, **pixels act as features**, and the entire grid represents a single data point. This combination 
@@ -331,7 +325,7 @@ elif st.session_state.current_page == "explore_images_video":
     # Annotate the grid with pixel labels
     for i in range(height):
         for j in range(width):
-            ax.text(j, i, f'{grid[i, j]:.2f}', ha='center', va='center', color='white', fontsize=6)
+            ax.text(j, i, f'{grid[i, j]:.2f}', ha='center', va='center', color='white', fontsize=10)
 
     # Set axis labels and title
     ax.set_title("Image as a Grid-Like Structure", fontsize=12)