> ## 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.

# Chart

> Plot device data over time — line, bar, area charts driven by live values.

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

## Mental model

A **Chart is an EKG.** It plots values *over time* so you can see trends, not just
the current number. Where a [Gauge](/dashboard/widgets/gauge) shows "now," a Chart
shows the history.

## When to use it

* Trends over time (temperature, speed, usage)
* Comparing series

## Settings

### General / Data

* **Widget Title / ID**
* Bind to a value/series or a database table in the [Data tab](/dashboard/binding-data)

### Style

* **Chart type** — line / bar / area
* **Axis** · **grid** · **legend**
* **Line stroke width** · **area opacity** · **bar border radius**

## Example — push points from firmware

Push a single value (appended to the series) or a whole array:

```cpp theme={null}
device.updateWidget(targetId, "tempChart", 27.4f);                        // append one
device.updateWidget(targetId, "tempChart", std::vector<float>{ 1,2,3 });  // a series
```

Or bind the Chart to a database table to plot stored history.

## Script API example

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

```js theme={null}
widget.on('tempChart', 'dataload', () => {
  widget.setText('chartStatus', 'Updated ' + new Date().toLocaleTimeString());
});
```

<Card title="Table" icon="table" href="/dashboard/widgets/table">
  The same data as rows.
</Card>
