Skip to content

Open-source graph visualization

Interactive network visualization with a WebAssembly graph store

Helios pairs a visual WebGPU/WebGL renderer with a data-first graph core. Use Helios Web when you need an interactive graph view for networks or embeddings. Use Helios Network when you need graph creation, attributes, selection, and serialization across JavaScript/WASM, Python, and native C. Use the CLI, Widget, Desktop, and agentic skills when you need automation, notebooks, native documents, or agent-driven workflows.

Helios Web

The browser visualization package: rendering, camera controls, behaviors, mappers, filters, labels, legends, layouts, persistence, and figure export. The hosted app and examples import the released `helios-web` package.

Open visual examples

Helios Network

The graph data package: a native C core compiled to WebAssembly, with JavaScript, Python, and C surfaces for attributes, selectors, queries, embeddings, and import/export.

Open API/data examples

Source-first API docs

API pages are regenerated from public exports plus JSDoc, Python docstrings, and Doxygen comments. Declaration files are downstream compatibility artifacts, not the place where API documentation is authored.

Open API reference

Apps and integrations

Helios CLI, Helios Widget, Helios Desktop, and portable skills reuse the same Web and Network runtime with host-specific persistence and workflow surfaces.

Open app docs

How The Pieces Fit

Helios is not a single monolithic viewer. The graph store, renderer, behaviors, UI panels, persistence, and host applications are separate layers that can be used together or independently.

  1. Graph data lives in Helios Network. It owns topology, typed attributes, selectors, queries, measurements, and import/export.
  2. Visual state lives in Helios Web. Mappers translate attributes into colors, sizes, opacity, widths, outlines, labels, legends, and density overlays.
  3. Interaction behavior is modular. Selection, hover, labels, legends, filters, layouts, export, interface state, and persistence are behaviors that can be configured or replaced.
  4. Host state belongs to the app. Browser storage, CLI sessions, notebook widget state, and desktop documents reuse the same runtime but persist data differently.

That split is why the documentation has both visual examples and data/API examples. Start with the visual examples when you are building an interface; start with the data/API examples when you are converting files, writing Python, or manipulating graphs programmatically.

Install

Use the current 0.10 release packages for browser and data workflows.

npm install helios-network helios-web

For data-only JavaScript:

npm install helios-network

For Python:

pip install helios-network

See Getting Started and Installation And Bundling for Vite, package.json, CDN-style imports, and local checkout setup.

First Choices

Goal Start With
Render a graph in a browser First visual graph
Build visual controls, mappers, filters, labels, or legends Visual examples
Load/save graph files or manipulate attributes Data/API examples
Choose a file format Data formats
Understand sessions, autosave, and portable visualization state Persistence guide
Inspect every public class and method API reference

Minimal App Shape

import HeliosNetwork from "helios-network";
import { Helios } from "helios-web";

const network = await HeliosNetwork.create({ directed: false });
network.addNodes(2);
network.addEdges([[0, 1]]);

const helios = new Helios(network, {
  container: document.querySelector("#app"),
});

await helios.ready;
helios.frameNetwork({ animate: false });

Documentation Status

This preview build is source-first: API pages are generated from public exports and source annotations, while guides and examples are written around runnable code. When a guide says a behavior, format, option, or import path is supported, it should either link to the generated API reference or show a minimal working example.

The rendered examples import the same staged bundles that power the hosted docs and app routes.