> ## Documentation Index
> Fetch the complete documentation index at: https://docs.hyperwisor.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Compass

> A compass that shows a heading value.

<Info>
  **Category:** Display · **Reads data:** yes (heading) · **Sends commands:** no
</Info>

## Mental model

A **Compass is a compass.** Push a heading (0–360°) and the needle points that way —
for vehicles, vessels, drones, or any bearing.

## When to use it

* Show heading / bearing / wind direction

## Settings

### Style

* **Compass size / color**
* **Needle color / length / width / style**
* **Show cardinal directions** · **direction labels** · **value**

## Example

```cpp theme={null}
device.updateWidget(targetId, "heading", (float)bearingDegrees);
```

## Script API example

The same interactions from a [dashboard script](/script/overview):

```js theme={null}
ws.onMessage((msg) => {
  if (typeof msg.heading === 'number') widget.setValue('heading', msg.heading);
});
```

<Card title="Attitude Indicator" icon="plane" href="/dashboard/widgets/attitude">
  For roll/pitch instead of heading.
</Card>