Neo4j Integration Demo [yFiles for HTML]

Description

This demo shows how to load data from a Neo4j database and display it with yFiles for HTML.

First, connect to a Neo4j database by entering a URL, a username and a password into the corresponding form fields, then click the Connect button.

After establishing a connection, a small set of data from the database will be displayed.

Things to Try

Explore the data: Change the viewport by dragging the canvas with the mouse and change the zoom level by using the mouse wheel.
Click on a node to select it, which will show its labels and properties in the properties view on the right.
Hover over a node to highlight the adjacent edges. Hover over an edge to highlight the adjacent nodes.
Move the sliders for the maximum node count and label diversity and then click the Reload Data button to query the database for a new set of data.
Warning: Retrieving data with the sliders set to high might take a really long time (2 minutes and more) or might yield no results at all, depending on the database.

Details

This demo uses the Neo4j Bolt driver for JavaScript to connect to a Neo4j database and query it for data.

The query results are then used by a custom yfiles.binding.GraphBuilder implementation to construct a graph from the data, while assigning different node styles to nodes with different labels.

The maximum node count setting limits the amount of nodes that are queries from the database, while the label diversity setting determines the length of the distinct node label sequences that is searched for.

The graph layout is achieved by using yfiles.organic.OrganicLayout with substructures enabled.

Connect to Neo4j database

Database URL
Username
Password
Use Encryption


Connections from https to http are forbidden by the browser's security policy. If you can't connect to a non-encrypted database, try clicking the link below to open this tool served on http. Open in http