Network Graph - Basic Network Explorer

import gradio as gr import networkx as nx from pyvis.network import Network import base64 import tempfile import os # Entity type colours (matching your NER tool) # Updated for better distinction between Person, Location, and Event ENTITY_COLOURS = { 'PERSON': '#00B894', # Green 'LOCATION': '#9B59B6', # Purple (more distinct from green) 'EVENT': '#F39C12', # Orange/Gold (very distinct) 'ORGANIZATION': '#55A3FF', # Light Blue 'DATE': '#FF6B6B' # Red } # Relationship types for dropdown (alphabetical, capitalised, no underscores) RELATIONSHIP_TYPES = [ 'Attended', 'Born in', 'Collaborates with', 'Died in', 'Employed by', 'Founded', 'Knows', 'Lives at', 'Located in', 'Married to', 'Member of', 'Occurred at', 'Other', 'Parent of', 'Participated in', 'Related to', 'Sibling of', 'Visited', 'Works with', 'Wrote' ] class NetworkGraphBuilder: def __init__(self): self.entities = [] self.relationships = [] def add_entity(self, name, entity_type, record_id): """Add an entity to the collection""" if name and name.strip(): # Avoid duplicates existing = [e for e in self.entities if e['name'].lower() == name.strip().lower()] if not existing: self.entities.append({ 'name': name.strip(), 'type': entity_type, 'record_id': record_id }) def add_relationship(self, source, target, rel_type): """Add a relationship between entities""" if source and target and source.strip() and target.strip() and source.strip() != target.strip(): self.relationships.append({ 'source': source.strip(), 'target': target.strip(), 'type': rel_type if rel_type else 'Related to' }) def build_graph(self): """Build NetworkX graph from entities and relationships""" G = nx.Graph() # Add nodes with attributes for entity in self.entities: G.add_node( entity['name'], entity_type=entity['type'], record_id=entity['record_id'] ) # Add edges for rel in self.relationships: if rel['source'] in G.nodes and rel['target'] in G.nodes: G.add_edge( rel['source'], rel['target'], relationship=rel['type'] ) return G def create_pyvis_graph(self, G, for_export=False): """Create interactive PyVis visualisation. Returns (iframe_html, standalone_html, stats_dict)""" if len(G.nodes) == 0: return None, None, None # Potato SVG as base64 data URI (Easter egg for Excellent Boiled Potatoes!) potato_svg = '''''' potato_data_uri = "data:image/svg+xml;base64," + base64.b64encode(potato_svg.encode()).decode() # Set height based on whether this is for export graph_height = "800px" if for_export else "600px" # Create PyVis network with dark theme net = Network( height=graph_height, width="100%", bgcolor="#1a1a2e", font_color="white", directed=False ) # Configure physics and styling net.set_options(""" { "nodes": { "borderWidth": 2, "borderWidthSelected": 4, "font": { "size": 18, "face": "arial", "color": "white", "strokeWidth": 3, "strokeColor": "#1a1a2e" }, "shadow": { "enabled": true, "color": "rgba(0,0,0,0.5)", "size": 10 } }, "edges": { "color": { "color": "#888888", "highlight": "#ffffff" }, "font": { "size": 14, "face": "arial", "color": "#ffffff", "strokeWidth": 0, "background": "rgba(26, 26, 46, 0.8)", "align": "middle" }, "smooth": { "enabled": true, "type": "continuous" }, "width": 2 }, "physics": { "enabled": true, "barnesHut": { "gravitationalConstant": -8000, "centralGravity": 0.3, "springLength": 150, "springConstant": 0.04, "damping": 0.09 }, "stabilisation": { "enabled": true, "iterations": 100 } }, "interaction": { "hover": true, "tooltipDelay": 200, "dragNodes": true, "dragView": true, "zoomView": true } } """) # Add nodes with styling based on entity type and degree for node in G.nodes(): data = G.nodes[node] entity_type = data.get('entity_type', 'UNKNOWN') colour = ENTITY_COLOURS.get(entity_type, '#CCCCCC') # Size based on connections (degree) degree = G.degree(node) size = 25 + (degree * 8) # Create plain text tooltip (no HTML) connections = list(G.neighbors(node)) title_lines = [ node, f"Type: {entity_type}", f"Connections: {len(connections)}" ] if connections: connected_to = ', '.join(connections[:5]) if len(connections) > 5: connected_to += f"... +{len(connections) - 5} more" title_lines.append(f"Connected to: {connected_to}") title = '\n'.join(title_lines) # Check if this is a potato node (Easter egg!) is_potato = 'potato' in node.lower() if is_potato: net.add_node( node, label=node, shape="image", image=potato_data_uri, size=size + 10, title=title, font={'size': 18, 'color': 'white', 'strokeWidth': 3, 'strokeColor': '#1a1a2e'} ) else: net.add_node( node, label=node, color=colour, size=size, title=title, font={'size': 18, 'color': 'white', 'strokeWidth': 3, 'strokeColor': '#1a1a2e'} ) # Add edges with relationship labels for edge in G.edges(data=True): rel_type = edge[2].get('relationship', '') net.add_edge( edge[0], edge[1], title=rel_type, label=rel_type, color='#888888', width=2, font={'size': 14, 'color': '#ffffff', 'strokeWidth': 0, 'background': 'rgba(26,26,46,0.8)'} ) # Generate HTML html = net.generate_html() # Store standalone HTML for export standalone_html = html # Calculate stats for export stats_dict = { 'nodes': G.number_of_nodes(), 'edges': G.number_of_edges(), 'density': nx.density(G) if len(G.edges) > 0 else 0, 'avg_degree': sum(dict(G.degree()).values()) / G.number_of_nodes() if G.number_of_nodes() > 0 else 0, 'top_nodes': sorted(dict(G.degree()).items(), key=lambda x: x[1], reverse=True)[:3] if G.number_of_nodes() > 0 else [] } # Encode as base64 data URI for iframe src html_bytes = html.encode('utf-8') b64_html = base64.b64encode(html_bytes).decode('utf-8') iframe_html = f''' ''' return iframe_html, standalone_html, stats_dict def collect_entities_from_records( p1, l1, e1, o1, d1, p2, l2, e2, o2, d2, p3, l3, e3, o3, d3, p4, l4, e4, o4, d4, p5, l5, e5, o5, d5, p6, l6, e6, o6, d6, p7, l7, e7, o7, d7, p8, l8, e8, o8, d8, p9, l9, e9, o9, d9, p10, l10, e10, o10, d10 ): """Collect all entities from the input fields""" builder = NetworkGraphBuilder() # Process each record records = [ (p1, l1, e1, o1, d1), (p2, l2, e2, o2, d2), (p3, l3, e3, o3, d3), (p4, l4, e4, o4, d4), (p5, l5, e5, o5, d5), (p6, l6, e6, o6, d6), (p7, l7, e7, o7, d7), (p8, l8, e8, o8, d8), (p9, l9, e9, o9, d9), (p10, l10, e10, o10, d10), ] for record_id, (person, location, event, org, date) in enumerate(records, 1): if person: builder.add_entity(person, 'PERSON', record_id) if location: builder.add_entity(location, 'LOCATION', record_id) if event: builder.add_entity(event, 'EVENT', record_id) if org: builder.add_entity(org, 'ORGANIZATION', record_id) if date: builder.add_entity(date, 'DATE', record_id) # Create list of all entity names for relationship dropdowns entity_names = sorted([e['name'] for e in builder.entities]) # Count by type counts = { 'PERSON': sum(1 for e in builder.entities if e['type'] == 'PERSON'), 'LOCATION': sum(1 for e in builder.entities if e['type'] == 'LOCATION'), 'EVENT': sum(1 for e in builder.entities if e['type'] == 'EVENT'), 'ORGANIZATION': sum(1 for e in builder.entities if e['type'] == 'ORGANIZATION'), 'DATE': sum(1 for e in builder.entities if e['type'] == 'DATE'), } # Create HTML summary that spans full width summary_html = f'''

📊 Identified Entities ({len(builder.entities)} total)

{counts['PERSON']}

👤 People

{counts['LOCATION']}

📍 Locations

{counts['EVENT']}

📅 Events

{counts['ORGANIZATION']}

🏢 Organisations

{counts['DATE']}

🗓️ Dates

Entities: {', '.join(entity_names) if entity_names else 'None found'}

''' # Return summary and update all 20 dropdowns (10 source + 10 target) return ( summary_html, gr.update(choices=entity_names, value=None), # source 1 gr.update(choices=entity_names, value=None), # target 1 gr.update(choices=entity_names, value=None), # source 2 gr.update(choices=entity_names, value=None), # target 2 gr.update(choices=entity_names, value=None), # source 3 gr.update(choices=entity_names, value=None), # target 3 gr.update(choices=entity_names, value=None), # source 4 gr.update(choices=entity_names, value=None), # target 4 gr.update(choices=entity_names, value=None), # source 5 gr.update(choices=entity_names, value=None), # target 5 gr.update(choices=entity_names, value=None), # source 6 gr.update(choices=entity_names, value=None), # target 6 gr.update(choices=entity_names, value=None), # source 7 gr.update(choices=entity_names, value=None), # target 7 gr.update(choices=entity_names, value=None), # source 8 gr.update(choices=entity_names, value=None), # target 8 gr.update(choices=entity_names, value=None), # source 9 gr.update(choices=entity_names, value=None), # target 9 gr.update(choices=entity_names, value=None), # source 10 gr.update(choices=entity_names, value=None), # target 10 ) def generate_network_graph( p1, l1, e1, o1, d1, p2, l2, e2, o2, d2, p3, l3, e3, o3, d3, p4, l4, e4, o4, d4, p5, l5, e5, o5, d5, p6, l6, e6, o6, d6, p7, l7, e7, o7, d7, p8, l8, e8, o8, d8, p9, l9, e9, o9, d9, p10, l10, e10, o10, d10, src1, rel1, tgt1, src2, rel2, tgt2, src3, rel3, tgt3, src4, rel4, tgt4, src5, rel5, tgt5, src6, rel6, tgt6, src7, rel7, tgt7, src8, rel8, tgt8, src9, rel9, tgt9, src10, rel10, tgt10 ): """Generate the network graph from all inputs""" try: builder = NetworkGraphBuilder() # Process each record records = [ (p1, l1, e1, o1, d1), (p2, l2, e2, o2, d2), (p3, l3, e3, o3, d3), (p4, l4, e4, o4, d4), (p5, l5, e5, o5, d5), (p6, l6, e6, o6, d6), (p7, l7, e7, o7, d7), (p8, l8, e8, o8, d8), (p9, l9, e9, o9, d9), (p10, l10, e10, o10, d10), ] for record_id, (person, location, event, org, date) in enumerate(records, 1): if person: builder.add_entity(person, 'PERSON', record_id) if location: builder.add_entity(location, 'LOCATION', record_id) if event: builder.add_entity(event, 'EVENT', record_id) if org: builder.add_entity(org, 'ORGANIZATION', record_id) if date: builder.add_entity(date, 'DATE', record_id) # Process relationships (now 10 total) relationships = [ (src1, rel1, tgt1), (src2, rel2, tgt2), (src3, rel3, tgt3), (src4, rel4, tgt4), (src5, rel5, tgt5), (src6, rel6, tgt6), (src7, rel7, tgt7), (src8, rel8, tgt8), (src9, rel9, tgt9), (src10, rel10, tgt10), ] for source, rel_type, target in relationships: if source and target: builder.add_relationship(source, target, rel_type) # Build graph G = builder.build_graph() if len(G.nodes) == 0: empty_html = '''

📊

No entities to display

Enter entities above and click "Process Entities" first

''' return empty_html, "❌ **No entities to display.** Please enter entities in Step 1 first." # Create visualisation graph_html, standalone_html, stats_dict = builder.create_pyvis_graph(G) # Create statistics with colour legend included stats_html = f'''

📈 Network Statistics

''' if len(G.edges) > 0: density = nx.density(G) avg_degree = sum(dict(G.degree()).values()) / G.number_of_nodes() stats_html += f'''

Nodes (Entities)	{G.number_of_nodes()}
Edges (Relationships)	{G.number_of_edges()}
Density (Connectedness) 0 = isolated, 1 = fully linked	{density:.3f}
Avg. Density	{avg_degree:.2f}

''' # Most connected degrees = dict(G.degree()) top_nodes = sorted(degrees.items(), key=lambda x: x[1], reverse=True)[:3] stats_html += '''

Most Connected:

{node}: {degree}

' else: stats_html += '''

⚠️ No relationships defined - nodes are isolated

''' stats_html += '

' # Add colour legend below stats stats_html += f'''

🎨 Entity Colour Legend

Person Location Event Organisation Date

🖱️ Interaction: Drag nodes • Scroll to zoom • Hover for details

''' return graph_html, stats_html except Exception as e: import traceback error_trace = traceback.format_exc() error_html = f'''

⚠️

Error generating graph

{str(e)}

''' return error_html, f"❌ Error: {str(e)}" def export_network_graph( p1, l1, e1, o1, d1, p2, l2, e2, o2, d2, p3, l3, e3, o3, d3, p4, l4, e4, o4, d4, p5, l5, e5, o5, d5, p6, l6, e6, o6, d6, p7, l7, e7, o7, d7, p8, l8, e8, o8, d8, p9, l9, e9, o9, d9, p10, l10, e10, o10, d10, src1, rel1, tgt1, src2, rel2, tgt2, src3, rel3, tgt3, src4, rel4, tgt4, src5, rel5, tgt5, src6, rel6, tgt6, src7, rel7, tgt7, src8, rel8, tgt8, src9, rel9, tgt9, src10, rel10, tgt10 ): """Export the network graph as a standalone HTML file""" try: builder = NetworkGraphBuilder() # Process each record records = [ (p1, l1, e1, o1, d1), (p2, l2, e2, o2, d2), (p3, l3, e3, o3, d3), (p4, l4, e4, o4, d4), (p5, l5, e5, o5, d5), (p6, l6, e6, o6, d6), (p7, l7, e7, o7, d7), (p8, l8, e8, o8, d8), (p9, l9, e9, o9, d9), (p10, l10, e10, o10, d10), ] for record_id, (person, location, event, org, date) in enumerate(records, 1): if person: builder.add_entity(person, 'PERSON', record_id) if location: builder.add_entity(location, 'LOCATION', record_id) if event: builder.add_entity(event, 'EVENT', record_id) if org: builder.add_entity(org, 'ORGANIZATION', record_id) if date: builder.add_entity(date, 'DATE', record_id) # Process relationships relationships = [ (src1, rel1, tgt1), (src2, rel2, tgt2), (src3, rel3, tgt3), (src4, rel4, tgt4), (src5, rel5, tgt5), (src6, rel6, tgt6), (src7, rel7, tgt7), (src8, rel8, tgt8), (src9, rel9, tgt9), (src10, rel10, tgt10), ] for source, rel_type, target in relationships: if source and target: builder.add_relationship(source, target, rel_type) # Build graph G = builder.build_graph() if len(G.nodes) == 0: return None # Create visualisation with export flag for larger size _, standalone_html, stats_dict = builder.create_pyvis_graph(G, for_export=True) # Create enhanced HTML with legend and statistics if standalone_html: # Build statistics HTML stats_content = f'''

📈 Network Statistics

Nodes (Entities)	{stats_dict['nodes']}
Edges (Relationships)	{stats_dict['edges']}
Density	{stats_dict['density']:.3f}
Avg. Connections	{stats_dict['avg_degree']:.2f}

''' if stats_dict['top_nodes']: stats_content += '''

Most Connected:

{node}: {degree} connections

' stats_content += '

' # Build legend HTML legend_html = f'''

🎨 Entity Colour Legend

Person Location Event Organisation Date

🖱️ Interaction: Drag nodes • Scroll to zoom • Hover for details

''' # Encode the graph HTML as base64 for the iframe graph_b64 = base64.b64encode(standalone_html.encode('utf-8')).decode('utf-8') # Create enhanced HTML wrapper enhanced_html = f''' Network Graph - Basic Network Explorer

''' export_file = tempfile.NamedTemporaryFile( mode='w', suffix='.html', prefix='network_graph_', delete=False, encoding='utf-8' ) export_file.write(enhanced_html) export_file.close() return export_file.name return None except Exception as e: return None def load_austen_example(): """Load the Jane Austen Pride and Prejudice example""" return ( # Record 1 "Elizabeth Bennet", "Longbourn", "Meryton Ball", "", "", # Record 2 "Mr. Darcy", "Pemberley", "Netherfield Ball", "", "", # Record 3 "Jane Bennet", "Netherfield", "", "", "", # Record 4 "Mr. Bingley", "London", "", "", "", # Record 5 "Mr. Wickham", "", "", "Militia", "", # Record 6 "Charlotte Lucas", "", "", "", "", # Record 7 "Mr. Collins", "", "Excellent Boiled Potatoes", "", "", # Record 8 "Caroline Bingley", "", "", "", "", # Record 9 "Lydia Bennet", "", "", "", "", # Record 10 "Lady Catherine de Bourgh", "", "", "", "", ) def load_wwii_example(): """Load a WWII history example""" return ( # Record 1 "Winston Churchill", "London", "Battle of Britain", "War Cabinet", "1940", # Record 2 "Franklin D. Roosevelt", "Washington D.C.", "D-Day", "Allied Forces", "1944", # Record 3 "Field Marshal Montgomery", "North Africa", "Battle of El Alamein", "Eighth Army", "1942", # Record 4 "Clement Attlee", "Potsdam", "Potsdam Conference", "Labour Party", "1945", # Record 5 "", "", "", "", "", # Record 6 "", "", "", "", "", # Record 7 "", "", "", "", "", # Record 8 "", "", "", "", "", # Record 9 "", "", "", "", "", # Record 10 "", "", "", "", "", ) def create_coloured_label(text, colour, emoji): """Create a coloured pill-style label HTML""" return f''' {emoji} {text} ''' def create_interface(): # Note: theme moved to launch() for Gradio 6.0 compatibility with gr.Blocks(title="Network Explorer") as demo: gr.Markdown(""" # 🕸️ Basic Network Explorer Build interactive network graphs by entering entities extracted through Named Entity Recognition (NER). ### How to use this tool: 1. **📝 Enter entities** in the records below (or load an example to get started) 2. **⚙️ Click "Process Entities"** to collect and prepare all entities for relationships 3. **🤝 Define relationships** between entities using the dropdowns (or type your own relationship type) 4. **🎨 Click "Generate Network Graph"** to visualise 5. **👁️ Explore** - drag nodes to rearrange, scroll to zoom, hover for details 6. **💾 Export (optional)** - click "Export as HTML" to download your graph as an interactive file """) gr.HTML("""

💡 Top tip: Start with just a few entities and relationships to see how it works!

""") # Quick start buttons gr.Markdown("### 💡 Quick Start - Load an Example:") with gr.Row(): austen_btn = gr.Button("📚 Jane Austen (Pride & Prejudice)", variant="secondary", size="sm") wwii_btn = gr.Button("⚔️ WWII History", variant="secondary", size="sm") gr.HTML("

") # ==================== STEP 1: ENTITY INPUT (5 per row) ==================== gr.Markdown("## 📝 Step 1: Enter Entities") entity_inputs = [] # First row: Records 1-5 with gr.Row(): with gr.Column(scale=1, min_width=180): gr.Markdown("**Record 1**") gr.HTML(create_coloured_label("Person", ENTITY_COLOURS['PERSON'], "👤")) p1 = gr.Textbox(label="", placeholder="e.g. Elizabeth Bennet", show_label=False) gr.HTML(create_coloured_label("Location", ENTITY_COLOURS['LOCATION'], "📍")) l1 = gr.Textbox(label="", placeholder="e.g. Longbourn", show_label=False) gr.HTML(create_coloured_label("Event", ENTITY_COLOURS['EVENT'], "📅")) e1 = gr.Textbox(label="", placeholder="e.g. Meryton Ball", show_label=False) gr.HTML(create_coloured_label("Organisation", ENTITY_COLOURS['ORGANIZATION'], "🏢")) o1 = gr.Textbox(label="", placeholder="e.g. The Militia", show_label=False) gr.HTML(create_coloured_label("Date", ENTITY_COLOURS['DATE'], "🗓️")) d1 = gr.Textbox(label="", placeholder="e.g. 1812", show_label=False) entity_inputs.extend([p1, l1, e1, o1, d1]) with gr.Column(scale=1, min_width=180): gr.Markdown("**Record 2**") gr.HTML(create_coloured_label("Person", ENTITY_COLOURS['PERSON'], "👤")) p2 = gr.Textbox(label="", placeholder="e.g. Mr. Darcy", show_label=False) gr.HTML(create_coloured_label("Location", ENTITY_COLOURS['LOCATION'], "📍")) l2 = gr.Textbox(label="", placeholder="e.g. Pemberley", show_label=False) gr.HTML(create_coloured_label("Event", ENTITY_COLOURS['EVENT'], "📅")) e2 = gr.Textbox(label="", placeholder="", show_label=False) gr.HTML(create_coloured_label("Organisation", ENTITY_COLOURS['ORGANIZATION'], "🏢")) o2 = gr.Textbox(label="", placeholder="", show_label=False) gr.HTML(create_coloured_label("Date", ENTITY_COLOURS['DATE'], "🗓️")) d2 = gr.Textbox(label="", placeholder="", show_label=False) entity_inputs.extend([p2, l2, e2, o2, d2]) with gr.Column(scale=1, min_width=180): gr.Markdown("**Record 3**") gr.HTML(create_coloured_label("Person", ENTITY_COLOURS['PERSON'], "👤")) p3 = gr.Textbox(label="", placeholder="", show_label=False) gr.HTML(create_coloured_label("Location", ENTITY_COLOURS['LOCATION'], "📍")) l3 = gr.Textbox(label="", placeholder="", show_label=False) gr.HTML(create_coloured_label("Event", ENTITY_COLOURS['EVENT'], "📅")) e3 = gr.Textbox(label="", placeholder="", show_label=False) gr.HTML(create_coloured_label("Organisation", ENTITY_COLOURS['ORGANIZATION'], "🏢")) o3 = gr.Textbox(label="", placeholder="", show_label=False) gr.HTML(create_coloured_label("Date", ENTITY_COLOURS['DATE'], "🗓️")) d3 = gr.Textbox(label="", placeholder="", show_label=False) entity_inputs.extend([p3, l3, e3, o3, d3]) with gr.Column(scale=1, min_width=180): gr.Markdown("**Record 4**") gr.HTML(create_coloured_label("Person", ENTITY_COLOURS['PERSON'], "👤")) p4 = gr.Textbox(label="", placeholder="", show_label=False) gr.HTML(create_coloured_label("Location", ENTITY_COLOURS['LOCATION'], "📍")) l4 = gr.Textbox(label="", placeholder="", show_label=False) gr.HTML(create_coloured_label("Event", ENTITY_COLOURS['EVENT'], "📅")) e4 = gr.Textbox(label="", placeholder="", show_label=False) gr.HTML(create_coloured_label("Organisation", ENTITY_COLOURS['ORGANIZATION'], "🏢")) o4 = gr.Textbox(label="", placeholder="", show_label=False) gr.HTML(create_coloured_label("Date", ENTITY_COLOURS['DATE'], "🗓️")) d4 = gr.Textbox(label="", placeholder="", show_label=False) entity_inputs.extend([p4, l4, e4, o4, d4]) with gr.Column(scale=1, min_width=180): gr.Markdown("**Record 5**") gr.HTML(create_coloured_label("Person", ENTITY_COLOURS['PERSON'], "👤")) p5 = gr.Textbox(label="", placeholder="", show_label=False) gr.HTML(create_coloured_label("Location", ENTITY_COLOURS['LOCATION'], "📍")) l5 = gr.Textbox(label="", placeholder="", show_label=False) gr.HTML(create_coloured_label("Event", ENTITY_COLOURS['EVENT'], "📅")) e5 = gr.Textbox(label="", placeholder="", show_label=False) gr.HTML(create_coloured_label("Organisation", ENTITY_COLOURS['ORGANIZATION'], "🏢")) o5 = gr.Textbox(label="", placeholder="", show_label=False) gr.HTML(create_coloured_label("Date", ENTITY_COLOURS['DATE'], "🗓️")) d5 = gr.Textbox(label="", placeholder="", show_label=False) entity_inputs.extend([p5, l5, e5, o5, d5]) # Additional records 6-10 with gr.Accordion("➕ Additional Records (6-10)", open=False): with gr.Row(): with gr.Column(scale=1, min_width=180): gr.Markdown("**Record 6**") gr.HTML(create_coloured_label("Person", ENTITY_COLOURS['PERSON'], "👤")) p6 = gr.Textbox(label="", show_label=False) gr.HTML(create_coloured_label("Location", ENTITY_COLOURS['LOCATION'], "📍")) l6 = gr.Textbox(label="", show_label=False) gr.HTML(create_coloured_label("Event", ENTITY_COLOURS['EVENT'], "📅")) e6 = gr.Textbox(label="", show_label=False) gr.HTML(create_coloured_label("Organisation", ENTITY_COLOURS['ORGANIZATION'], "🏢")) o6 = gr.Textbox(label="", show_label=False) gr.HTML(create_coloured_label("Date", ENTITY_COLOURS['DATE'], "🗓️")) d6 = gr.Textbox(label="", show_label=False) entity_inputs.extend([p6, l6, e6, o6, d6]) with gr.Column(scale=1, min_width=180): gr.Markdown("**Record 7**") gr.HTML(create_coloured_label("Person", ENTITY_COLOURS['PERSON'], "👤")) p7 = gr.Textbox(label="", show_label=False) gr.HTML(create_coloured_label("Location", ENTITY_COLOURS['LOCATION'], "📍")) l7 = gr.Textbox(label="", show_label=False) gr.HTML(create_coloured_label("Event", ENTITY_COLOURS['EVENT'], "📅")) e7 = gr.Textbox(label="", show_label=False) gr.HTML(create_coloured_label("Organisation", ENTITY_COLOURS['ORGANIZATION'], "🏢")) o7 = gr.Textbox(label="", show_label=False) gr.HTML(create_coloured_label("Date", ENTITY_COLOURS['DATE'], "🗓️")) d7 = gr.Textbox(label="", show_label=False) entity_inputs.extend([p7, l7, e7, o7, d7]) with gr.Column(scale=1, min_width=180): gr.Markdown("**Record 8**") gr.HTML(create_coloured_label("Person", ENTITY_COLOURS['PERSON'], "👤")) p8 = gr.Textbox(label="", show_label=False) gr.HTML(create_coloured_label("Location", ENTITY_COLOURS['LOCATION'], "📍")) l8 = gr.Textbox(label="", show_label=False) gr.HTML(create_coloured_label("Event", ENTITY_COLOURS['EVENT'], "📅")) e8 = gr.Textbox(label="", show_label=False) gr.HTML(create_coloured_label("Organisation", ENTITY_COLOURS['ORGANIZATION'], "🏢")) o8 = gr.Textbox(label="", show_label=False) gr.HTML(create_coloured_label("Date", ENTITY_COLOURS['DATE'], "🗓️")) d8 = gr.Textbox(label="", show_label=False) entity_inputs.extend([p8, l8, e8, o8, d8]) with gr.Column(scale=1, min_width=180): gr.Markdown("**Record 9**") gr.HTML(create_coloured_label("Person", ENTITY_COLOURS['PERSON'], "👤")) p9 = gr.Textbox(label="", show_label=False) gr.HTML(create_coloured_label("Location", ENTITY_COLOURS['LOCATION'], "📍")) l9 = gr.Textbox(label="", show_label=False) gr.HTML(create_coloured_label("Event", ENTITY_COLOURS['EVENT'], "📅")) e9 = gr.Textbox(label="", show_label=False) gr.HTML(create_coloured_label("Organisation", ENTITY_COLOURS['ORGANIZATION'], "🏢")) o9 = gr.Textbox(label="", show_label=False) gr.HTML(create_coloured_label("Date", ENTITY_COLOURS['DATE'], "🗓️")) d9 = gr.Textbox(label="", show_label=False) entity_inputs.extend([p9, l9, e9, o9, d9]) with gr.Column(scale=1, min_width=180): gr.Markdown("**Record 10**") gr.HTML(create_coloured_label("Person", ENTITY_COLOURS['PERSON'], "👤")) p10 = gr.Textbox(label="", show_label=False) gr.HTML(create_coloured_label("Location", ENTITY_COLOURS['LOCATION'], "📍")) l10 = gr.Textbox(label="", show_label=False) gr.HTML(create_coloured_label("Event", ENTITY_COLOURS['EVENT'], "📅")) e10 = gr.Textbox(label="", show_label=False) gr.HTML(create_coloured_label("Organisation", ENTITY_COLOURS['ORGANIZATION'], "🏢")) o10 = gr.Textbox(label="", show_label=False) gr.HTML(create_coloured_label("Date", ENTITY_COLOURS['DATE'], "🗓️")) d10 = gr.Textbox(label="", show_label=False) entity_inputs.extend([p10, l10, e10, o10, d10]) gr.HTML("

") # ==================== STEP 2: PROCESS ENTITIES ==================== gr.Markdown("## ⚙️ Step 2: Process Entities") gr.Markdown("*Click the button below to collect all entities before defining relationships*") # Process button collect_btn = gr.Button("⚙️ Process Entities", variant="primary", size="lg") # Full-width entity summary entity_summary = gr.HTML() gr.HTML("

") # ==================== STEP 3: RELATIONSHIPS (Grid) ==================== gr.Markdown("## 🤝 Step 3: Define Relationships") gr.Markdown("*Select entities from the dropdowns to create connections (click 'Process Entities' first). You can also type your own relationship type.*") # Relationship inputs in a grid (5 columns for first 5) relationship_inputs = [] with gr.Row(): with gr.Column(scale=1, min_width=180): gr.Markdown("**Relationship 1**") src1 = gr.Dropdown(label="From", choices=[]) rel1 = gr.Dropdown(label="Type", choices=RELATIONSHIP_TYPES, value="Related to", allow_custom_value=True) tgt1 = gr.Dropdown(label="To", choices=[]) relationship_inputs.extend([src1, rel1, tgt1]) with gr.Column(scale=1, min_width=180): gr.Markdown("**Relationship 2**") src2 = gr.Dropdown(label="From", choices=[]) rel2 = gr.Dropdown(label="Type", choices=RELATIONSHIP_TYPES, value="Related to", allow_custom_value=True) tgt2 = gr.Dropdown(label="To", choices=[]) relationship_inputs.extend([src2, rel2, tgt2]) with gr.Column(scale=1, min_width=180): gr.Markdown("**Relationship 3**") src3 = gr.Dropdown(label="From", choices=[]) rel3 = gr.Dropdown(label="Type", choices=RELATIONSHIP_TYPES, value="Related to", allow_custom_value=True) tgt3 = gr.Dropdown(label="To", choices=[]) relationship_inputs.extend([src3, rel3, tgt3]) with gr.Column(scale=1, min_width=180): gr.Markdown("**Relationship 4**") src4 = gr.Dropdown(label="From", choices=[]) rel4 = gr.Dropdown(label="Type", choices=RELATIONSHIP_TYPES, value="Related to", allow_custom_value=True) tgt4 = gr.Dropdown(label="To", choices=[]) relationship_inputs.extend([src4, rel4, tgt4]) with gr.Column(scale=1, min_width=180): gr.Markdown("**Relationship 5**") src5 = gr.Dropdown(label="From", choices=[]) rel5 = gr.Dropdown(label="Type", choices=RELATIONSHIP_TYPES, value="Related to", allow_custom_value=True) tgt5 = gr.Dropdown(label="To", choices=[]) relationship_inputs.extend([src5, rel5, tgt5]) # Additional relationships 6-10 with gr.Accordion("➕ Additional Relationships (6-10)", open=False): with gr.Row(): with gr.Column(scale=1, min_width=180): gr.Markdown("**Relationship 6**") src6 = gr.Dropdown(label="From", choices=[]) rel6 = gr.Dropdown(label="Type", choices=RELATIONSHIP_TYPES, value="Related to", allow_custom_value=True) tgt6 = gr.Dropdown(label="To", choices=[]) relationship_inputs.extend([src6, rel6, tgt6]) with gr.Column(scale=1, min_width=180): gr.Markdown("**Relationship 7**") src7 = gr.Dropdown(label="From", choices=[]) rel7 = gr.Dropdown(label="Type", choices=RELATIONSHIP_TYPES, value="Related to", allow_custom_value=True) tgt7 = gr.Dropdown(label="To", choices=[]) relationship_inputs.extend([src7, rel7, tgt7]) with gr.Column(scale=1, min_width=180): gr.Markdown("**Relationship 8**") src8 = gr.Dropdown(label="From", choices=[]) rel8 = gr.Dropdown(label="Type", choices=RELATIONSHIP_TYPES, value="Related to", allow_custom_value=True) tgt8 = gr.Dropdown(label="To", choices=[]) relationship_inputs.extend([src8, rel8, tgt8]) with gr.Column(scale=1, min_width=180): gr.Markdown("**Relationship 9**") src9 = gr.Dropdown(label="From", choices=[]) rel9 = gr.Dropdown(label="Type", choices=RELATIONSHIP_TYPES, value="Related to", allow_custom_value=True) tgt9 = gr.Dropdown(label="To", choices=[]) relationship_inputs.extend([src9, rel9, tgt9]) with gr.Column(scale=1, min_width=180): gr.Markdown("**Relationship 10**") src10 = gr.Dropdown(label="From", choices=[]) rel10 = gr.Dropdown(label="Type", choices=RELATIONSHIP_TYPES, value="Related to", allow_custom_value=True) tgt10 = gr.Dropdown(label="To", choices=[]) relationship_inputs.extend([src10, rel10, tgt10]) gr.HTML("

") # ==================== STEP 4: GENERATE & VIEW ==================== gr.Markdown("## 🎨 Step 4: Generate Network Graph") generate_btn = gr.Button("🎨 Generate Network Graph", variant="primary", size="lg") # Full-width network graph with stats sidebar (legend now included in stats) with gr.Row(): with gr.Column(scale=3): network_plot = gr.HTML(label="Interactive Network Graph") with gr.Column(scale=1): network_stats = gr.HTML() # Export section gr.Markdown("### 💾 Export Your Graph") gr.Markdown("*Generate a graph first, then click export to download*") with gr.Row(): export_btn = gr.Button("💾 Export as HTML", variant="secondary", size="sm") export_file = gr.File( label="Download Interactive HTML", file_types=[".html"], interactive=False ) gr.HTML("""

💡 The exported HTML file is fully interactive — open it in any web browser to explore your network!

""") # ==================== WIRE UP EVENTS ==================== # Example buttons austen_btn.click( fn=load_austen_example, inputs=[], outputs=entity_inputs ) wwii_btn.click( fn=load_wwii_example, inputs=[], outputs=entity_inputs ) # Collect entities - now updates 20 dropdowns (10 relationships x 2) collect_btn.click( fn=collect_entities_from_records, inputs=entity_inputs, outputs=[ entity_summary, src1, tgt1, src2, tgt2, src3, tgt3, src4, tgt4, src5, tgt5, src6, tgt6, src7, tgt7, src8, tgt8, src9, tgt9, src10, tgt10 ] ) # Generate graph - outputs the visualisation and stats all_inputs = entity_inputs + relationship_inputs generate_btn.click( fn=generate_network_graph, inputs=all_inputs, outputs=[network_plot, network_stats] ) # Export graph - separate button for downloading export_btn.click( fn=export_network_graph, inputs=all_inputs, outputs=[export_file] ) # Model Information & Documentation section gr.HTML("""

📚 Library Information & Documentation

Learn more about the libraries used in this tool:

NetworkX: NetworkX Documentation ↗ — Python library for creating, manipulating, and studying complex networks
PyVis: PyVis Documentation ↗ — Interactive network visualisation library built on vis.js
Gradio: Gradio Documentation ↗ — Web interface framework for machine learning demos

""") # Footer gr.HTML("""

This Basic Network Explorer tool was developed as part of a Bodleian Libraries (Oxford) Sassoon Research Fellowship.

Built with the aid of Claude Opus 4.5.

""") return demo if __name__ == "__main__": demo = create_interface() # Gradio 6.0 compatibility: theme and ssr_mode moved to launch() demo.launch(ssr_mode=False, theme=gr.themes.Soft())

📊 Identified Entities ({len(builder.entities)} total)

No entities to display

📈 Network Statistics

🎨 Entity Colour Legend

Error generating graph

📈 Network Statistics

🎨 Entity Colour Legend

🕸️ Network Graph

📚 Library Information & Documentation