About This Web Application

Overview

This web application is a proof-of-concept system for rich sparse network visualization. It is designed to support the exploration of large graph-based datasets in which node positions, clusters, labels, semantic similarity, time, and local relational context all matter at the same time.

Unlike many conventional network visualization tools that rely mainly on force-directed layouts and show all edges directly, this application focuses on sparse, structure-aware exploration. The main graph emphasizes embedded positions, multi-level clustering, selective labeling, contextual local expansion, and coordinated sidebar interaction. The result is a view that aims to stay readable even when the dataset is large, spatially uneven, or semantically organized rather than purely topological.

How It Works

At a high level, the application separates preprocessing from interaction.

Before the visualization is shown in the browser, the dataset is transformed into graph structures that are suitable for exploration. This includes computing node positions in a 2D space, assigning clusters at multiple levels, generating region boundaries around clusters, and preparing auxiliary graph data used for local drill-down and statistics.

At runtime, the web app loads these processed graph structures and renders them in an interactive SVG view. The main canvas on the right shows the embedded graph. The sidebar on the left provides coordinated controls for search, filtering, local expansion, seminar information, and graph statistics. User actions such as zooming, clicking, brushing, and searching update the currently visible subset of information without changing the underlying dataset.

How To Use This Web App

Interacting With the Graph

The main graph is shown on the right side of the page.

You can zoom and pan to move between overview and detail. At lower zoom levels, the visualization emphasizes larger cluster regions. As you zoom in, more local detail becomes visible, including sub-clusters, node labels, and eventually full seminar titles. Labels are shown selectively at intermediate zoom levels to reduce overlap, and at higher zoom levels all visible labels can appear.

Hovering over a node highlights its local neighborhood. This helps reveal which nearby nodes are directly related to it without drawing all edges permanently.

Clicking a node selects it. When a node is selected, the sidebar updates to show textual information about that item. If the people overlay is enabled, clicking a node also reveals a local person-item subgraph centered on the selected item.

Using the Left Sidebar

The left sidebar contains the main controls and information panels.

Search

The search bar supports two modes.

The first mode searches the primary graph items, such as seminars. This highlights items whose titles match the search string.

The second mode searches related entities, such as participants. Instead of simply highlighting text matches, this search retrieves and displays the local subgraph associated with matching entities. This is useful when the user wants to explore the relationship structure around a person rather than around an item title.

The reason there are two search modes is that the application distinguishes between primary nodes displayed on the map and secondary relational entities that may be shown only when needed.

Toggle People

The Toggle People switch enables or disables the local person overlay.

When it is off, the visualization stays focused on the main graph only.

When it is on and a node is selected, the application requests the local person-item subgraph for that node and displays the connected people and nearby related items. This allows the user to inspect the local relational context without permanently cluttering the main view.

Filter Chart

The Filter Chart is a time-based brush view. It shows how many graph items occur in each year and lets the user restrict the visible graph to a selected time interval.

Dragging the brush updates the visible nodes in the main view and updates the displayed date range below the chart. The chart is responsive to window size so it remains usable on different screen widths.

Seminar Information Panel

The text panel in the middle of the sidebar shows information about the currently selected item.

When a seminar node is clicked, this panel displays its title, date range, participant listing, and descriptive text. If no node has been selected yet, the panel remains empty.

In a future dataset extension, this same panel can be reused for the description of whatever the primary item type is.

Stat Panel

The Stat Panel is placed at the bottom of the sidebar.

It is non-interactive except for the checkbox in its header. That checkbox collapses or expands the panel content while keeping the section header visible.

The panel is divided into two parts.

Global Graph

This section summarizes properties of the full primary graph currently loaded by the application.

Nodes: the total number of nodes in the graph

Edges: the total number of edges in the graph

Connected Components: the number of disconnected parts of the graph

Density: how many edges exist relative to the maximum number of possible edges

Average Clustering: the average tendency of nodes to form tightly connected local groups

Average Shortest Path: the average number of hops needed to move between pairs of nodes, when this is well-defined for the graph

These values help the user understand the global structure of the network before exploring individual items.

Selected Seminar Subgraph

This section summarizes the local subgraph associated with the currently selected seminar.

If no seminar is selected, the values are shown as -.

Nodes: the number of nodes in the selected local subgraph

Edges: the number of edges in that local subgraph

Connected Components: how many disconnected parts exist within that local view

Density: how dense that local subgraph is

Average Shortest Path: the average number of hops between nodes in the selected local subgraph, when defined

These values are useful for comparing how locally connected or dispersed different selected seminars are.

Contributers and Acknowledgements

Developed under the Chair of Efficient Algorithms of Technical University of Munich.