UI Components
@plexus/ui is a GPU-accelerated React component library for real-time visualization of physical systems. Every component renders with WebGPU (WebGL2 fallback), handles 100k+ data points at 60fps, and supports zero-copy buffer updates for live streaming.
Installation
Add individual components to your project with the CLI:
npx @plexus/cli add <component>Features
- WebGPU / WebGL2 — Hardware-accelerated rendering with automatic fallback
- 100k+ points at 60fps — No downsampling, no lag
- Zero-copy buffer updates — Stream data without re-allocating memory
- Dark mode — All components support light and dark themes
- TypeScript — Full type definitions for every component and prop
Charts
Line Chart
stableMulti-series time-series with GPU-accelerated rendering. Handles 100k+ points.
Scatter Chart
betaVariable point sizes and colors for correlation analysis.
Bar Chart
betaVertical/horizontal orientation with grouped and stacked modes.
Area Chart
betaFilled regions with stacked series support.
Heatmap
beta2D grid visualization with custom color scales.
Histogram
stableAuto-binning with Sturges, Scott, and Freedman-Diaconis algorithms.
Instruments
Radar Chart
betaPolar coordinate display with sweep animation.
Attitude Indicator
stableArtificial horizon showing pitch and roll orientation.
Data Display
Timeline
Interactive
Annotations
stableText annotations, time-range regions, and measurement rulers for charts.
3D
3D Model Viewer
stableSTL/OBJ/GLTF/GLB model viewer with vertex color overlay for data mapping.
Point Cloud Viewer
stableRender millions of points with color mapping by height, intensity, or classification.
Next Steps
Click any component above to see installation, usage examples, and full API reference.