RingNet: An Interactive Platform for Multi-Modal Data Visualization in Networks

RingNet is a web-based interactive platform that integrates an efficient R backend with a flexible JavaScript frontend to enable domain experts to visualize, explore, and export multi-omics network data without requiring advanced computational expertise.

The Gist

Imagine you are trying to understand a massive, chaotic city. You have maps of the roads (the connections), lists of every building (the nodes), and separate reports on the weather, traffic, crime rates, and population demographics for every single building.

Right now, scientists trying to understand complex diseases like cancer or eczema face this exact problem. They have mountains of data from different sources (DNA, proteins, cell activity), but looking at them separately is like trying to understand the city by only looking at the traffic report while ignoring the weather. Existing tools are often like old, clunky GPS units: they work, but they require you to be a professional cartographer to use them, and they struggle to show you all the data at once without getting messy.

Enter RingNet.

Think of RingNet as a super-powered, interactive "City Dashboard" that brings all those separate reports together into one beautiful, easy-to-read view. Here is how it works, using simple analogies:

1. The "Ring" Concept: A Multi-Layered Donut

The core magic of RingNet is how it displays data. Instead of making you look at five different charts, it turns every single "building" (like a gene or a cell) into a multi-layered donut.

• The Center: This is the building itself (e.g., a specific gene).
• The Rings: Imagine the donut has up to five colorful rings around it.
  • The outer ring might show the "weather" (e.g., the patient's disease stage).
  • The next ring shows the "traffic" (e.g., how active the gene is).
  • The inner rings show "crime stats" or "population" (e.g., DNA mutations or chemical changes).

Because all these rings are on the same donut, you can instantly see how the weather affects the traffic for that specific building. If the outer ring is red (bad weather) and the inner ring is also red (bad traffic), you know there's a problem right there. If they are different colors, you know the relationship is complex.

2. The "Traffic Map": Seeing Connections

The donuts don't just float in space; they are connected by roads (lines).

• In a cancer study, these roads show how genes talk to each other.
• In an eczema study, these roads show how different types of immune cells are shouting at each other.

RingNet lets you color these roads based on the conversation. A red road might mean "stop" (inhibition), while a green road means "go" (activation). You can zoom in, zoom out, and filter the map to only show the busiest roads or the most important neighborhoods.

3. No "GPS License" Required

One of the biggest problems with current scientific tools is that you need to be a computer programmer to use them. It's like needing a pilot's license just to drive a car.

RingNet is built like a user-friendly website.

• You (the scientist): Just drag and drop your data files (like a spreadsheet) onto the screen.
• RingNet (the engine): It does all the heavy lifting in the background, crunching the numbers and building the 3D map.
• The Result: You get an interactive picture you can click, drag, and explore with your mouse, just like using Google Maps.

4. Real-World Examples from the Paper

The authors tested this "City Dashboard" on two real medical mysteries:

• The Breast Cancer City: They looked at 651 patients. By putting all the genetic data, DNA changes, and tumor stages onto the "donuts," they could instantly spot patterns. They saw which genes were consistently "on fire" (highly active) and which ones were "frozen" (inactive) across different patients. This helps doctors understand why some tumors grow fast and others don't.
• The Eczema Neighborhood: They looked at skin cells from patients with eczema. The tool visualized how immune cells were "yelling" at skin cells to cause inflammation. It showed a dense web of communication that explains why the skin gets thick and itchy, helping researchers see the exact path to a cure.

Why This Matters

Before RingNet, scientists had to juggle five different software programs to get this picture, often losing the connection between the data points. RingNet acts as a universal translator, turning complex, boring spreadsheets into a single, colorful, interactive story.

It lowers the barrier so that a biologist who isn't a coder can explore their data, find the "aha!" moments, and share their discoveries with the world faster. It turns the chaos of big data into a clear, navigable map.

Technical Summary

1. Problem Statement

The exponential growth of multi-omics datasets (genomics, epigenomics, transcriptomics, proteomics, metabolomics) in systems medicine has created a critical need for intuitive visualization tools. Current challenges include:

• Complexity and Scale: Existing tools often struggle to handle the scale and complexity of modern biomedical datasets.
• Accessibility: Many network visualization tools (e.g., Cytoscape) require specialized programming skills or extensive computational training, creating barriers for domain experts.
• Fragmented Representation: Existing solutions often visualize cross-omics data as separate networks that must be manually combined using prior knowledge, or they limit the visualization of multiple data modalities within a single node (e.g., displaying only one value per dataset per node).
• Lack of Integration: There is a gap in tools that can visualize diverse multi-omics datasets within a single, compact network representation while preserving biological hierarchy and context.

2. Methodology: RingNet Architecture

RingNet is a web-based, three-tier interactive platform designed to bridge computational efficiency with user-driven exploration.

A. System Architecture

• Tier 1: Session Management: Users upload CSV files via a web interface. The server validates inputs, creates a unique session ID, stores assets, and returns a JSON payload describing file paths.
• Tier 2: Backend (R-based):
  • Input Processing: Accepts three mandatory CSV tables: Graph Edges (interactions), Graph Nodes (identifiers), and Node Groups (assignments). It also supports up to five data matrices (continuous, integer, or categorical).
  • Data Harmonization: Uses intersection-based alignment rules to ensure consistency across sample and node identifiers without assuming numerical comparability between heterogeneous data types.
  • Network Construction: Utilizes the R package igraph to construct directed or undirected networks.
  • Layout Optimization: Computes 2D node coordinates using a stress-based layout algorithm (graphlayouts::layout_with_stress). This treats edges as elastic constraints, placing strongly connected nodes closer together and pushing weakly connected nodes apart. A fallback to a force-directed layout is used for small/fragmented networks.
  • Output: Generates a JSON artifact containing precomputed layouts, identifiers, and multi-modal data.
• Tier 3: Frontend (JavaScript-based):
  • Built with D3.js (v6) to render the JSON artifact as an interactive SVG scene.
  • Visualization Logic: Each network node can display up to five concentric rings.
    • Outer Ring: Categorical data (e.g., tumor stage, cell type).
    • Inner Rings: Numerical data (e.g., gene expression, methylation, CNV).
    • Alignment: Sector elements within rings correspond to specific samples (rows in data matrices), allowing for joint visualization of multi-modal data for a single entity.
  • Interactivity: Users can filter nodes/edges by value or topology (e.g., degree), recolor, rescale, and export figures.

B. Technical Features

• Parallel Processing: Supports parallel visualization of multiple networks using R's parallel package (parLapply), enabling near-linear speedups for balanced network sizes (tested up to 25 networks simultaneously).
• Security: Deployed via Apache with TLS/HTTPS enforcement, HSTS headers, and internal port binding for backend services to ensure secure data handling.
• Export: Supports reproducible, publication-ready exports in SVG, PDF, and JSON formats.

3. Key Contributions

• Compact Multi-Modal Representation: RingNet introduces a novel "ring-based" visualization where a single node can simultaneously display up to five different data modalities (mixing categorical and numerical data) aligned by sample/sector.
• Accessibility: It lowers the barrier to entry by providing a web-based interface that requires no programming skills for visualization, while leveraging R for robust backend computation.
• Deterministic Rendering: By pre-computing layouts in the backend and exporting them as fixed attributes in JSON, the frontend ensures deterministic rendering without requiring users to re-calculate complex layouts.
• Scalability: The architecture supports the visualization of large networks (up to ~1,800 nodes and ~6,000 edges) and the parallel processing of multiple network instances.

4. Results and Case Studies

The authors validated RingNet using two distinct biological case studies:

Case Study 1: TCGA Breast Cancer Cohort (Multi-Omics)

• Data: Integrated a gene regulatory network (8,185 genes, 48,534 interactions) with multi-omics data from 651 TCGA breast cancer patients (mutations, CNV, methylation, transcriptomics, clinical data).
• Visualization: A subnetwork of 16 GPCR-related genes was visualized.
• Findings:
  • Revealed consistent expression patterns (e.g., high expression of GNAQ, low expression of TACR1).
  • Identified correlations between molecular profiles (e.g., TACR1 showed high methylation and low expression; GNA11 showed high methylation and high expression).
  • Visualized copy number variations (amplifications/deletions) and mutations across the cohort within a single node view.

Case Study 2: Atopic Dermatitis (Single-Cell Communication)

• Data: Applied to scRNA-seq data from 39,042 cells from lesional skin of atopic dermatitis patients.
• Method: Used CellChat to infer intercellular communication networks, then visualized with RingNet.
• Visualization: Nodes represented cell types; rings represented the expression profiles of 555 genes. Edges represented ligand-receptor interactions.
• Findings:
  • Mapped dense communication hubs between inflammatory dendritic cells, T cells, and fibroblast populations.
  • Visualized bidirectional signaling mechanisms (e.g., cytokine/chemokine signaling) that drive epidermal thickening and fibrosis, providing a holistic view of the disease microenvironment.

5. Significance

• Accelerated Discovery: RingNet enables researchers to uncover hidden biological patterns and relationships across multiple data layers without needing advanced computational expertise.
• Enhanced Interpretability: The compact, ring-based design allows for the direct assessment of correlations among diverse data types and the comparison of distributional patterns across nodes or groups.
• Reproducibility: The ability to export JSON files allows researchers to share and reproduce network visualizations without rerunning the entire computational pipeline.
• Community Impact: By integrating computational biology with intuitive web-based interaction, RingNet serves as a bridge for network medicine research, making complex systems biology accessible to a broader range of biomedical experts.

Availability:

• Web Tool: https://ringnet.rd.tuni.fi
• Source Code: https://github.com/laixn/ringnet