VesselNav

visualizationreacttypescriptd3spring-bootpostgresql

A cyber-medical discovery platform for the human vascular system — a physics-based force graph, a ⌘K pathfinder, and animated blood flow along any route.

What it is

A dark glassmorphism dashboard where vessels are nodes in a D3 force graph with per-type SVG glow filters. A ⌘K command palette lets you pick two vessels and BFS finds the route between them, then a particle system animates blood flow along the path. A Vessel Deep Dive panel covers anatomy, common conditions, connected body systems, and an animated segment preview. The graph is served by Spring Boot from a Flyway-seeded PostgreSQL database.

Why it matters

Anatomy references are static diagrams. Treating the vascular system as a graph makes it explorable — you can ask how blood gets from A to B and watch the answer.

Stack

React 18TypeScriptD3.js v7Framer MotionZustandTailwind CSSSpring Boot 3PostgreSQL 15Flyway

View on GitHub →Live site →

← All projects