Update app.py

app.py

@@ -5,7 +5,7 @@ import networkx as nx
 # Sidebar for selecting an option
 sidebar_option = st.sidebar.radio("Select an option", 
                                  ["Select an option", "Basic: Properties", 
-                                  "Basic: Read and write graphs", "Basic: Simple graph"])
+                                  "Basic: Read and write graphs", "Basic: Simple graph", "Basic: Simple graph Directed"])
 
 # Function to display properties and graph for Basic: Properties
 def display_graph_properties(G):
@@ -96,6 +96,25 @@ def display_simple_graph(G, pos=None):
     plt.axis("off")
     st.pyplot(plt)
 
+# Function to display Simple Directed Graphs for Basic: Simple graph Directed
+def display_simple_directed_graph(G, pos=None):
+    options = {
+        "node_size": 500,
+        "node_color": "lightblue",
+        "arrowsize": 20,
+        "width": 2,
+        "edge_color": "gray",
+    }
+    
+    # Draw the directed graph with the given positions and options
+    nx.draw_networkx(G, pos, **options)
+
+    # Set margins for the axes so that nodes aren't clipped
+    ax = plt.gca()
+    ax.margins(0.20)
+    plt.axis("off")
+    st.pyplot(plt)
+
 # Display Basic: Properties if selected
 if sidebar_option == "Basic: Properties":
     st.title("Basic: Properties")
@@ -180,4 +199,51 @@ elif sidebar_option == "Basic: Simple graph":
             
             # Set a basic layout (spring layout as default)
             pos = nx.spring_layout(G_custom, seed=42)
-            display_simple_graph(G_custom, pos)
+            display_simple_graph(G_custom, pos)
+
+# Display Basic: Simple Directed Graph if selected
+elif sidebar_option == "Basic: Simple graph Directed":
+    st.title("Basic: Simple graph Directed")
+    option = st.radio("Choose a graph type:", ("Default Example", "Create your own"))
+
+    # Default example: simple directed graph
+    if option == "Default Example":
+        G = nx.DiGraph([(0, 3), (1, 3), (2, 4), (3, 5), (3, 6), (4, 6), (5, 6)])
+
+        # Group nodes by column
+        left_nodes = [0, 1, 2]
+        middle_nodes = [3, 4]
+        right_nodes = [5, 6]
+
+        # Set the position according to column (x-coord)
+        pos = {n: (0, i) for i, n in enumerate(left_nodes)}
+        pos.update({n: (1, i + 0.5) for i, n in enumerate(middle_nodes)})
+        pos.update({n: (2, i + 0.5) for i, n in enumerate(right_nodes)})
+
+        # Draw the directed graph
+        display_simple_directed_graph(G, pos)
+
+    # Create your own directed graph
+    elif option == "Create your own":
+        num_nodes = st.number_input("Number of nodes:", min_value=2, max_value=20, value=5)
+        edges = []
+        
+        # Let the user define directed edges
+        st.write("Enter the directed edges (as pairs of nodes) separated by commas. For example, 1,2 or 3,4.")
+        edge_input = st.text_area("Edges:", value="1,2\n1,3\n2,3")
+        
+        # Parse the edges
+        if edge_input:
+            edge_list = edge_input.split("\n")
+            for edge in edge_list:
+                u, v = map(int, edge.split(","))
+                edges.append((u, v))
+
+        # Button to generate the directed graph
+        if st.button("Generate"):
+            G_custom = nx.DiGraph()
+            G_custom.add_edges_from(edges)
+            
+            # Set a basic layout (spring layout as default)
+            pos = nx.spring_layout(G_custom, seed=42)
+            display_simple_directed_graph(G_custom, pos)