# imu.svelte — IMU

<span style="white-space: pre-wrap;">Displays live inertial measurement unit data received from the </span>`<span class="editor-theme-code">imu-update</span>`<span style="white-space: pre-wrap;"> Tauri event.</span>

### Data displayed

**Accelerometer**<span style="white-space: pre-wrap;"> — X/Y/Z values in m/s² with a live scrolling sparkline chart showing the last 60 samples per axis. Each axis has a distinct colour (red, purple, green).</span>

**Gyroscope**<span style="white-space: pre-wrap;"> — X/Y/Z values in °/s with the same sparkline treatment.</span>

**Orientation cube**<span style="white-space: pre-wrap;"> — a CSS 3D cube whose </span>`<span class="editor-theme-code">rotateX/Y/Z</span>`<span style="white-space: pre-wrap;"> transform is driven by integrating the gyroscope values over time, giving a visual indication of the rover's pitch, roll, and yaw. Euler angles are displayed numerically next to the cube.</span>

**Compass**<span style="white-space: pre-wrap;"> — a Canvas-drawn compass rose with tick marks, cardinal labels, and a red needle pointing in the direction derived from the magnetometer X/Y values. The needle and labels adapt to light/dark colour scheme.</span>

**Status bar**<span style="white-space: pre-wrap;"> — shows calibration status (✓ Cal / ! Uncal), sensor state (Idle / Operating / Calibrating / Error), any active error code, and the current update rate in Hz.</span>

### Performance

<span style="white-space: pre-wrap;">Incoming events are batched using </span>`<span class="editor-theme-code">requestAnimationFrame</span>`<span style="white-space: pre-wrap;"> — a </span>`<span class="editor-theme-code">pending</span>`<span style="white-space: pre-wrap;"> buffer holds the latest payload and the render only runs on the next animation frame, so high-frequency updates (up to 50Hz) never block the UI thread. The Hz counter counts packets per second independently of renders.</span>