@flightcn

Flightcn is a specialized shadcn registry component set for rendering flight-route and satellite-orbit visualizations on MapLibre-powered maps via the mapcn ecosystem. It provides FlightAirport (single airport marker from IATA code), FlightRoute (great-circle arc between two airports), FlightRoutes (multiple independent routes), FlightMultileg (connected multi-leg journeys), and SatelliteOrbit (globe-based orbital ground tracks with animated markers and custom SVG support). Includes a built-in airport registry with IATA code, name, city, country, and coordinates. Handles antimeridian, hover states, animated paths, and optional airport labels. Use for: adding interactive great-circle flight maps or satellite orbit overlays to a Next.js/MapLibre project that already uses mapcn, with minimal custom geographic math.

2 components react shadcn-cli MIT

website ↗ github ↗ registry ↗

Install this registry

shadcn (npm) npx shadcn@latest add https://flightcn.yencheng.dev/r/registry.json

pnpm pnpm dlx shadcn@latest add https://flightcn.yencheng.dev/r/registry.json

bun bunx shadcn@latest add https://flightcn.yencheng.dev/r/registry.json

fetch registry curl -s https://flightcn.yencheng.dev/r/registry.json

Components

2 total

Flight ui

A flight route visualization component with airport markers, great-circle arc lines, and a built-in 515-airport database.

npx shadcn@latest add https://flightcn.yencheng.dev/r/flight.json

Satellite ui

A globe-based satellite orbit overlay with animated motion, ground tracks, and custom SVG marker support.

npx shadcn@latest add https://flightcn.yencheng.dev/r/satellite.json