opinion
GraphExplorer
A force-directed network of people, projects and files, with search and a category legend.
Who is on whatSelect a node, then Expand to reveal the crew
100%
100%
100%
In context
Project networkThe graph beside the project it is showing
Who is on whatPeople, projects and files
100%
On track
Harbour rebrandBrand
Identity, site and launch kit for the harbour trust.
84% doneProps
| Prop | Type | Required | Default |
|---|---|---|---|
nodes | GraphExplorerNode[] | Yes | — |
edges | GraphExplorerEdge[] | Yes | — |
title | string | undefined | No | — |
ariaLabel | string | undefined | No | — |
width | number | undefined | No | 640 |
height | number | undefined | No | 480 |
legend | boolean | undefined | No | true |
searchable | boolean | undefined | No | true |
pinnable | boolean | undefined | No | true |
nodeActions | ((node: GraphExplorerNode) => GraphExplorerAction[]) | undefined | No | — |
onNodeClick | ((node: GraphExplorerNode) => void) | undefined | No | — |
chargeStrength | number | undefined | No | -30 |
linkDistance | number | undefined | No | 50 |
className | string | undefined | No | — |
bionic | boolean | undefined | No | — |
bionicOptions | BionicOptions | undefined | No | — |
data-rebar-* attributes
data-rebar-component="graph-explorer" on the root; parts: toolbar, search, search-results, zoom-controls, legend, legend-chip, canvas-wrap, canvas, radial-menu, radial-menu-button, status (the visually-hidden aria-live selection announcer).
Migrating to Ant Design
Not codemod-covered — AntD has no force-directed network graph component at all; migrating means reaching for a dedicated graph-visualization library (e.g. AntV G6, from the same Ant ecosystem) directly.