Update app.py

app.py

@@ -10,7 +10,8 @@ sidebar_option = st.sidebar.radio("Select an option",
                                   "Basic: Read and write graphs", "Basic: Simple graph", 
                                   "Basic: Simple graph Directed", "Drawing: Custom Node Position",
                                   "Drawing: Cluster Layout", "Drawing: Degree Analysis",
-                                  "Drawing: Ego Graph", "Drawing: Eigenvalues"])
+                                  "Drawing: Ego Graph", "Drawing: Eigenvalues", "Drawing: Four Grids"])
+
 
 # Helper function to draw and display graph
 def draw_graph(G, pos=None, title="Graph Visualization"):
@@ -18,6 +19,103 @@ def draw_graph(G, pos=None, title="Graph Visualization"):
     nx.draw(G, pos=pos, with_labels=True, node_color='lightblue', node_size=500, font_size=10, font_weight='bold')
     st.pyplot(plt)
 
+# Function to display Four Grids visualization for Drawing: Four Grids
+def display_four_grids():
+    st.title("Drawing: Four Grids")
+
+    option = st.radio("Choose a graph type:", ("Default Example", "Create your own"))
+
+    if option == "Default Example":
+        # Generate a 4x4 grid graph
+        G = nx.grid_2d_graph(4, 4)  # 4x4 grid
+        pos = nx.spring_layout(G, iterations=100, seed=39775)
+
+        # Create a 2x2 subplot
+        fig, all_axes = plt.subplots(2, 2)
+        ax = all_axes.flat
+
+        # Draw graphs in 4 different styles
+        nx.draw(G, pos, ax=ax[0], font_size=8)
+        nx.draw(G, pos, ax=ax[1], node_size=0, with_labels=False)
+        nx.draw(
+            G,
+            pos,
+            ax=ax[2],
+            node_color="tab:green",
+            edgecolors="tab:gray",  # Node surface color
+            edge_color="tab:gray",  # Color of graph edges
+            node_size=250,
+            with_labels=False,
+            width=6,
+        )
+        H = G.to_directed()
+        nx.draw(
+            H,
+            pos,
+            ax=ax[3],
+            node_color="tab:orange",
+            node_size=20,
+            with_labels=False,
+            arrowsize=10,
+            width=2,
+        )
+
+        # Set margins for the axes so that nodes aren't clipped
+        for a in ax:
+            a.margins(0.10)
+        fig.tight_layout()
+        st.pyplot(fig)
+
+    elif option == "Create your own":
+        # Allow the user to customize the grid dimensions
+        rows = st.number_input("Number of rows:", min_value=2, max_value=20, value=4)
+        cols = st.number_input("Number of columns:", min_value=2, max_value=20, value=4)
+
+        if st.button("Generate"):
+            # Generate a custom grid graph
+            G_custom = nx.grid_2d_graph(rows, cols)  # Create the grid graph
+            pos = nx.spring_layout(G_custom, iterations=100, seed=39775)
+
+            # Create a 2x2 subplot
+            fig, all_axes = plt.subplots(2, 2)
+            ax = all_axes.flat
+
+            # Draw graphs in 4 different styles
+            nx.draw(G_custom, pos, ax=ax[0], font_size=8)
+            nx.draw(G_custom, pos, ax=ax[1], node_size=0, with_labels=False)
+            nx.draw(
+                G_custom,
+                pos,
+                ax=ax[2],
+                node_color="tab:green",
+                edgecolors="tab:gray",  # Node surface color
+                edge_color="tab:gray",  # Color of graph edges
+                node_size=250,
+                with_labels=False,
+                width=6,
+            )
+            H = G_custom.to_directed()
+            nx.draw(
+                H,
+                pos,
+                ax=ax[3],
+                node_color="tab:orange",
+                node_size=20,
+                with_labels=False,
+                arrowsize=10,
+                width=2,
+            )
+
+            # Set margins for the axes so that nodes aren't clipped
+            for a in ax:
+                a.margins(0.10)
+            fig.tight_layout()
+            st.pyplot(fig)
+
+# Display Drawing: Four Grids if selected
+if sidebar_option == "Drawing: Four Grids":
+    display_four_grids()
+
 # Function to display Eigenvalue analysis for Drawing: Eigenvalues
 def display_eigenvalue_analysis():
     st.title("Drawing: Eigenvalues")