Attitude Indicator

Artificial horizon showing pitch and roll orientation. Use cases: Aircraft displays, drone ground stations, spacecraft attitude, surgical robot orientation, gimbal stabilization, ROV navigation.

Installation

Copy and paste the following code into your project.

npx @plexusui/cli add attitude-indicator

Manual Installation

1. Copy the component code from components/attitude-indicator.tsx

2. Install dependencies:

npm install react@latest

3. Copy any required primitive components

Examples

Basic Attitude Indicator

Interactive artificial horizon for pitch and roll visualization

PITCH: 0.0°

ROLL: 0.0°

Controls

Pitch0.0°level

Roll0.0°level

Drone Flight Simulation

Real-time UAV attitude monitoring with live telemetry - Perfect for drone control interfaces

Primary Flight Display

PITCH: 0.0°

ROLL: 0.0°

Flight Telemetry

Altitude

50.0m

Heading

0°

Pitch

0.0°

Roll

0.0°

LANDED

Spacecraft Attitude Control

Orbital vehicle orientation with RCS thruster control - Used in satellite operations

Spacecraft Orientation

PITCH: 0.0°

ROLL: 0.0°

RCS Controls

Target Pitch0°

Target Roll0°

Current Attitude

Pitch

0.0°

Roll

0.0°

Yaw

0°

Surgical Robot Orientation

Real-time surgical instrument tracking - Used in da Vinci systems and minimally invasive surgery

Instrument Orientation

PITCH: 0.0°

ROLL: 0.0°

Angle Readings

Pitch Angle

0.00°

Range: ±15°

Roll Angle

0.00°

Range: ±15°

System Settings

Tremor Filtering

Remove hand tremor

Motion Scaling3:1

Precision ModeActive

STANDBY

Primitive Components

Build custom attitude indicators with primitive components for maximum flexibility

PITCH: +15.0°

ROLL: -20.0°

Adjust Orientation

Pitch15°

Roll-20°

Loading example...