Update pages/Data Collection.py

pages/Data Collection.py

@@ -315,34 +315,28 @@ elif st.session_state.current_page == "explore_images_video":
     """, unsafe_allow_html=True)
 
 
-    # Visualization for Grid-Like Structure
-    height, width = 3,3
-    grid = np.random.rand(height, width)
+    # Interactive Pixel Grid Section
+    st.subheader("Interactive Pixel Grid")
     
-    # Adjust the figure size to make the plot very small
-    fig, ax = plt.subplots(figsize=(2,2))  # Even smaller figure size
-    cax = ax.imshow(grid, cmap='viridis', interpolation='nearest')
-
-    # 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', fontsize=4)  # Smaller fontsize
+    # User Input for Height and Width
+    height = st.number_input("Enter Image Height (pixels):", min_value=1, max_value=50, value=10, step=1)
+    width = st.number_input("Enter Image Width (pixels):", min_value=1, max_value=50, value=10, step=1)
     
-    # Set axis labels and title
-    ax.set_title("Image as a Grid-Like Structure", fontsize=5)  # Smaller title size
-    ax.set_xlabel("Width (Pixels)", fontsize=4)  # Smaller label size
-    ax.set_ylabel("Height (Pixels)", fontsize=4)  # Smaller label size
-    ax.set_xticks(range(width))
-    ax.set_yticks(range(height))
-    ax.set_xticklabels([f'Col {j+1}' for j in range(width)], fontsize=4)  # Smaller label size
-    ax.set_yticklabels([f'Row {i+1}' for i in range(height)], fontsize=4)  # Smaller label size
-    ax.grid(color='white', linestyle='-', linewidth=0.5)  # Thinner grid lines
+    # Display Resolution
+    resolution = height * width
+    st.write(f"**Image Resolution**: {resolution} pixels")
     
-    # Color bar setup without fontsize argument
-    cbar = fig.colorbar(cax, ax=ax, orientation='vertical')
-    cbar.ax.tick_params(labelsize=4)  # Adjust the font size of the color bar
+    # Generate and Display Pixel Grid
+    st.write("**Pixel Grid Visualization:**")
+    grid = np.random.rand(int(height), int(width))  # Generate random grid values
+    fig, ax = plt.subplots()
+    cax = ax.imshow(grid, cmap="viridis")  # Display grid with 'viridis' color map
+    plt.colorbar(cax, ax=ax)  # Add color bar for context
+    ax.set_title("Pixel Grid")
+    ax.set_xlabel("Width")
+    ax.set_ylabel("Height")
     
-    # Display the plot
+    # Render the Plot
     st.pyplot(fig)
 
     # Section: What are Color Spaces?