@neo4j-nvl/base

Neo4j Visualization Library

Welcome to NVL (Neo4j Visualization Library). NVL is a collection of libraries that can be used to build custom graph visualizations like Neo4j Bloom. The NVL library is also available as a React component that can be used in React applications.

Consuming the library

Installing the library

You can install the library with your preferred package manager, for example

npm install @neo4j-nvl/base

If you want to add common interactivity to the graph, install the NVL interaction handlers. If you are planning to use NVL in a React app, be sure to check out the NVL React wrappers.

Using the library

This is a basic setup for a NVL instance.

const nodes = [
  { id: '1', label: 'Node 1', color: '#e04141' },
  { id: '2', label: 'Node 2', color: '#e09c41' }
]

const relationships = [{ id: '12', from: '1', to: '2' }]

const options = {
  layout: 'forceDirected',
  initialZoom: 0.5
}

const callbacks = {
  onLayoutDone: () => console.log('Layout done')
}

const nvl = new NVL(document.getElementById('frame'), nodes, relationships, options, callbacks)

You can find more instructions and examples on how to use NVL in the docs.

Product analytics

In order to improve the library we are collecting some information about the usage of NVL. If you prefer to disable this behavior set the parameter disableTelemetry=true as a parameter in nvlOptions.