Chris Collins

Tools · infra

Graph database playground

Write Cypher against sample graphs — movies, a social network, a metro — in an engine that runs in the page (MATCH with variable-length paths and shortestPath, WITH, aggregation, CREATE/MERGE/SET/DELETE, EXPLAIN and PROFILE), see results as a force-directed graph, a table or cypher-shell text, and run the same queries on a real Neo4j over Bolt.

Added

Works with

How to use it

A property graph stores nodes (with labels such as :Person and properties such as name) and relationships between them (with one type, such as :ACTED_IN, a direction and their own properties). Cypher queries it by drawing the shape you are looking for: (p:Person)-[:ACTED_IN]→(m:Movie). This page has a Cypher engine of its own, so everything works with nothing installed; it can also talk to Neo4j itself.

How to use it

  1. Pick a graph: Movies (people and films in the shape of Neo4j’s movie graph — :Person {name, born}, :Movie {title, released, tagline}, ACTED_IN {roles}, DIRECTED, PRODUCED, WROTE), Social network (made-up people who FOLLOW each other, LIVE_IN cities and LIKE interests), Metro network (a made-up metro: stations CONNECT with {line, minutes}; the minutes are illustrative) or an empty graph.

  2. Choose one of its example queries or write your own, and Run (Ctrl/⌘+Enter). Parameters go in the box beside Run as JSON ({"name": "Tom Hanks"} for $name).

  3. Read the result as a Graph (any nodes, relationships or paths the query returns), a Table, Text (as cypher-shell prints it) or the Plan. In the graph, drag nodes (they stay where you put them; Re-layout frees them), drag the background to pan, scroll or pinch to zoom, click a node for its properties and double-click it to add its neighbours. Full screen (F) gives the drawing the whole screen, with the side panel beside it.

  4. The side panel lists the graph’s labels and relationship types with their counts; click one to query it.

  5. Write queries change the built-in graph; Undo last change steps back (ten steps), Reset graph restores the sample, and Keep changes in this browser remembers your edits.

  6. The Cypher guide tab walks through the language with runnable examples.

The Cypher this page understands

  • MATCH and OPTIONAL MATCH with node patterns (variables, labels, property maps), relationships in either or both directions with one or several types ([:A|B]), variable length (, *2, *1..3, ..5; open-ended patterns stop at 15 hops), path variables (p = …), shortestPath(…) and allShortestPaths(…) (breadth-first), and several comma-separated patterns. A relationship is used at most once per MATCH, as in Neo4j.

  • WHERE with AND, OR, XOR, NOT, comparisons (chained, 1 < x < 3), IN, STARTS WITH, ENDS WITH, CONTAINS, =~, IS [NOT] NULL, label tests (n:Person) and pattern predicates (NOT (a)-[:KNOWS]→(b), exists(…)). Three-valued logic: comparisons with null are null.

  • RETURN and WITH with aliases, DISTINCT, , ORDER BY (nulls last ascending), SKIP, LIMIT; aggregation with count(), count, collect, sum, avg, min, max (and DISTINCT inside them) grouped by the other items; WITH … WHERE to filter aggregates.

  • UNWIND, CASE, list literals, indexing and slices, list comprehensions, reduce(acc = 0, x IN list | …), all/any/none/single(x IN list WHERE …), maps, $parameters, and functions: id, elementId, labels, type, properties, keys, size, length, nodes, relationships, startNode, endNode, coalesce, head, last, tail, range, reverse, toUpper, toLower, trim, split, substring, replace, left, right, toString, toInteger, toFloat, toBoolean, abs, round, floor, ceil, sqrt, sign, rand, timestamp.

  • Writes: CREATE, MERGE with ON CREATE SET / ON MATCH SET, SET (properties, += maps, = maps, labels), REMOVE, DELETE and DETACH DELETE — with the counts Neo4j reports.

  • EXPLAIN shows the operators the engine uses, in Neo4j’s names (NodeByLabelScan, Expand(All), VarLengthExpand, ShortestPath, Filter, EagerAggregation, Projection, Sort, Top, Limit, ProduceResults…) with row estimates from label counts; PROFILE runs the query and counts rows and db hits per clause. Neo4j’s own planner is cost-based and uses indexes, so its plan for the same query can differ — run it there to compare.

The engine was checked against Neo4j 5.26: 28 queries on the three sample graphs (patterns, variable-length paths, shortest paths, aggregation and grouping, OPTIONAL MATCH, pattern predicates, list functions, CASE, ordering and paging) returned the same rows.

Connecting to Neo4j

Choose Run on → Neo4j. The page speaks Bolt — Neo4j’s binary protocol (the handshake, the PackStream encoding, HELLO/LOGON, RUN/PULL, RESET after an error) — written for this page and carried on a WebSocket, which Neo4j accepts on its Bolt port. It offers Bolt 5.0–5.8 and 4.2–4.4. Three routes:

  • Direct — a WebSocket to ws://localhost:7687. Start a Neo4j to play with:

    docker run --rm -p 7474:7474 -p 7687:7687 -e NEO4J_AUTH=neo4j/choose-a-password neo4j:5

    From this https page, an unencrypted ws:// connection is allowed only to localhost.

  • ⚡ App WebSocket relay — through the gitwebsite app (companion 1.2): a WebSocket proxy to ws://host:7687 on your network. The first connection to a new host asks you in the app.

  • ⚡ App TCP relay — through the app’s TCP relay to host:7687 (Bolt over plain TCP; add the target to the app’s TCP allow-list if the app does not offer to).

The password stays in the page’s memory, never saved or put in a link. Queries run as that user: write queries change that database. Load this sample graph into Neo4j copies the current sample graph there (with a second, explicit question before it deletes anything), and Compare with the built-in engine runs the query on both and says whether the rows match. In Neo4j, EXPLAIN and PROFILE show Neo4j’s own plan on the Plan view; dates, times, durations and points are shown as text.

Linking to an example

The graph, the query and the result view travel in share links; hand-written ones:

Parameter Meaning

example

hanks (Tom Hanks’s films, drawn), films (the same as a table), coactors, bacon (six degrees: shortestPath), recommend, movies (the whole movie graph); mutual, suggest, network (social); metro, quickest (sum of minutes with reduce), interchanges (transport)

g

the graph: movies, social, transport, empty

q

the query (URL-encoded)

view

graph, table, text or plan

For example /tools/graph-db/?example=bacon, /tools/graph-db/?example=metro, /tools/graph-db/?g=social&q=MATCH%20(n)%20RETURN%20n&view=table.

Limits

  • A subset of Cypher: no UNION, CALL subqueries or procedures (db.*, APOC, GDS), FOREACH, LOAD CSV, indexes and constraints, temporal or spatial functions, quantified path patterns (Cypher 25 {1,3} syntax) or map projections. Integers and floats are JavaScript numbers (so very large integers lose precision, and 1.0 prints as 1).

  • Open-ended variable-length patterns stop at 15 hops and shortest paths at 50; the engine enumerates paths rather than planning, so wide * patterns on big graphs are slow (PROFILE shows how many look-ups a query makes).

  • The graph view draws up to a few hundred nodes comfortably (the layout is an all-pairs force simulation).

  • Bolt: no routing (neo4j:// cluster discovery), no TLS of its own (wss:// through the app or a proxy), no explicit transactions (each query auto-commits), and results are fetched in one PULL.

Related: Graph algorithms, Graph drawing, DynamoDB single-table modeller, Postgres playground, Redis client.

Runs entirely in your browser — network requests go only to the services named on this page.