grafer

Grafer is a large graph/network rendering library written using webGL, specializing in displaying and interacting with large datasets in real time. It provides multiple node types including simple geometric shapes and custom textures. Multiple edge types are also provided such as straight line, straight path, and bezier. Labels are customizable, with options included to change background, placement, and font. The viewer can operate in 2D or 3D.

Usage Example
import { GraferController } from '@uncharted.software/grafer';
const nodes = {
data: [
{ x: -8.6, y: 5.0 },
{ x: 8.6, y: 5.0 },
{ x: 0.0, y: -10.0 },
{ x: 0.0, y: 0.0 },
],
};
const edges = {
data: [
{ source: 0, target: 1 },
{ source: 1, target: 2 },
{ source: 2, target: 0 },
{ source: 3, target: 0 },
{ source: 3, target: 1 },
{ source: 3, target: 2 },
],
};
const canvas = document.getElementById('grafer_container');
const layers = [{ nodes, edges }];
new GraferController(canvas, { layers });
See more examples available here.
Documentation
All documentaton, including API reference, is available here.
Examples
yarn install to install all required dependencies
yarn run develop to build and start the hot-reload dev server
- Access examples at http://localhost:8090/
Development
yarn install to install all required dependencies
- One of the following scripts depending on use case:
yarn run build to build the library from source
yarn run develop to build and start the hot-reload dev server (which also allows examples to be accessed at http://localhost:8090/)
yarn run lint to run linter
yarn run test to run tests
Publishing Instructions
- Remove all uncommitted changes from the
src directory
npm version <new_version_number> to update the version number
yarn run prepack to run build and validation scripts
npm publish to publish to NPM
- Ensure tags are pushed to Github
- Use tag to create a new release with changelog