3D Earth globe with real-time SGP4 satellite flight dynamics, orbital paths, and ground stations. GPU Points for large constellations.
Copy and paste the following code into your project.
npx plexus-ui add globe
1. Copy the component code from components/globe.tsx
2. Install dependencies:
npm install react@latest
3. Copy any required primitive components
Download the required texture maps for this component.
A photoreal Earth with a real-time day/night terminator, the ISS propagated with SGP4, its orbital path, sub-satellite ground track, and ground stations. Drag to orbit the camera.
144 satellites across 12 orbital planes from Keplerian elements. Above the points threshold the globe switches to a single GPU draw and propagates off the main thread.
3D Earth globe with real-time SGP4 satellite propagation, orbital paths, ground tracks, and ground stations.
| Prop | Type | Default | Description |
|---|---|---|---|
| satellites | SatelliteInput[] | [] | Objects to plot, each via a TLE (SGP4) or Keplerian elements. |
| groundStations | GroundMarker[] | [] | Fixed surface markers ({ id, lat, lng, color?, label? }). |
| showOrbitalPaths | boolean | true | Draw each satellite's orbital path (identical orbits are deduped). |
| showGroundTracks | boolean | false | Draw sub-satellite ground tracks on the surface. |
| pointsThreshold | number | 30 | Switch to single-draw GPU points at/above this satellite count. |
| useWorker | boolean | auto | Propagate in a Web Worker. Defaults on above pointsThreshold. |
| textureUrl | string | undefined | Day-surface texture URL. Procedural shading is used if omitted. |
| epochOverride | number | undefined | Freeze propagation at this epoch (ms). Omit for live time. |
| autoRotate | boolean | false | Auto-rotate the camera. |
| height | number | string | "500px" | Container height. |
| onSelectSatellite | (id: string) => void | undefined | Called with a satellite id when its marker is clicked. |
