@neo4j-nvl/base

Neo4j Visualization Library

Welcome to the Neo4j Visualization Library, NVL for short. NVL is a collection of libraries that can be used to build custom graph visualizations like those used in Neo4j Bloom and Explore(powered by Bloom). NVL is written in TypeScript and can be used in any JavaScript project. It 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, you can 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' }, { id: '2' }]
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.

Further Resources

• NVL documentation: https://neo4j.com/docs/nvl/current/
• NVL API docs: https://neo4j.com/docs/api/nvl/current/
• NVL code examples: https://neo4j.com/docs/api/nvl/current/examples.html