D3 Force Diagram | Demo

Built in Typescript with d3 v7

Features

• node highlighting (type in search field or click one or more nodes)
• node dragging (click and drag a node)
• node selection and display of metadata (single-click a node)
• node hierarchy up to two levels in depth (double-click a node to explode or re-group)

Usage

Requires npm. Clone this repository, then run

npm install
npm run start

Data format

Sample data is stored in the public/data folder and set in the .env file.