@neo4j-nvl/interaction-handlers

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.

This module is a collection of decorator classes that can be used to add interaction events to an NVL instance. The decorators are applied to the NVL class. You can find more information about the NVL class in the NVL base library.

Consuming the library

Installing the library

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

npm install @neo4j-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

Heres is an example on how to use an interaction handler with the NVL class:

import { ClickInteraction } from '@neo4j-nvl/interaction-handlers'
import { NVL } from '@neo4j-nvl/base'
 *
const nvl = new NVL(nodes, relationships, options)
const clickInteraction = new ClickInteraction(nvl)
clickInteraction.updateCallback('onNodeClick', (node) => {
  console.log('Node clicked', node)
})

If you are using React and want to add interactivity to your graph, you can also make use of the InteractiveReactWrapper.

You can find more instructions and examples on how to use NVL interaction handlers in the docs and API docs, as well as in these NVL code examples.