Maintained starter · 36 entities · 45 relationships
Start with Vite and TypeScript
Download one complete project, replace the investigation data, and keep the rendering machinery inside OGJS. The starter is packed and rebuilt against the same npm artifact developers install.
Select an entity in the graph.
Run the project
The archive contains the exact maintained source shown in the preview. It has one runtime dependency: @mizansec/ogjs.
Open the downloaded archive
Move the extracted package directory into your workspace and rename it for your application.
Install locked dependencies
Run npm install inside the project directory.
Open the local development server
Run npm run dev, then edit src/graph.ts.
tar -xzf ogjs-vite-typescript-starter.tgz --strip-components=1 npm install npm run dev
A small application boundary
The starter separates business meaning from visualization plumbing, so replacing its payment data does not require rewriting its canvas lifecycle.
Your application provides
- Stable entity and relationship ids
- Labels, semantic roles, and domain groups
- The action to take after a user selects something
OGJS provides
- Readable node, relationship, and label presentation
- Group placement, camera framing, and resize retention
- WebGL rendering, picking, accessibility, and cleanup
Continue with your stack
Use the same graph contract in a framework or notebook. These are lifecycle integrations already shipped by OGJS, not separate visualization implementations.
| Environment | Start here | What remains stable |
|---|---|---|
| React · Vue · Svelte · Angular | Framework bindings | Graph data, public events, presentation intent |
| Jupyter | Notebook lifecycle | Stable protocol document and ids |
| Java · C# · Go · PHP · Rust | Language bridge | The same protocol-1 graph document |