A Dashboard is a live canvas of widgets that visualize what your devices are reporting right now. Each widget is bound to one or more device Attributes and updates on its own over a live connection. You arrange widgets on a grid, resize them, group them, and the layout saves itself. This page covers how dashboards work, how to organize them, and a complete catalog of every widget type with its configuration options.

Flow diagram: a device reports an Attribute reading, which is stored, then streamed over a WebSocket connection to the browser. Each widget on the dashboard grid is registered for the device and attribute it binds to, and re-renders when a new reading arrives. The grid auto-refreshes every 10 seconds.
How a dashboard stays live: each widget subscribes to its attributes and updates as new readings stream in.
Naming note: in the UI you bind widgets to a Device and an Attribute. Behind the scenes the API calls an Attribute a data type (and an Endpoint a data source). You only ever see “Attribute” and “Endpoint” in the product.

Where Dashboards Live

Every dashboard belongs to an application. You open, create, and manage an application’s dashboards from its Dashboards page, which is organized as tabs: you open dashboards into tabs and switch between them in place, rather than scrolling a list. A widget you create inside an application stays in that application’s context.

Permissions: seeing dashboards needs the dashboard view permission, and editing the layout or widgets needs the widget edit permission. If you can view but not edit, the grid is read-only: no drag, no resize, no toolbar edit actions.

Create, rename, and delete

The Dashboards page with a row of dashboard tabs across the top and the active dashboard's grid below. When no tabs are open, a 'No open dashboard tabs' panel offers Show dashboard and Create new dashboard buttons.
The Dashboards page is tab-based. Open a dashboard into a tab, switch between open tabs, or create a new one.
Create dashboard modal with a Dashboard Title field (required) and an optional Description textarea, plus Cancel and Create buttons.
Creating a dashboard. Only the Dashboard Title is required.
  • 1
    On the Dashboards page, create a new dashboard. Give it a Dashboard Title (required) and an optional Description.
  • 2
    Rename or edit the title and description any time from the dashboard’s gear menu (Edit). You can also double-click the dashboard’s description to edit it in place; the title is renamed from the Edit dialog (or by double-clicking a dashboard’s tab to rename the tab).
  • 3
    The gear menu also offers Duplicate (creates a “Copy of …” with all its widgets) and Delete. Delete asks for confirmation, then permanently removes the dashboard and every widget on it. Deleting a dashboard cannot be undone — the Undo toast applies only to deleting an individual widget on a dashboard (see The Grid), not to deleting a whole dashboard.
Not yet available: the dashboard editor has commented-out controls for “Who can access this dashboard?” (Only me / My team / workspace) and “Receive alerts for this dashboard?”. These are hidden in the current product and are never sent when you save, so they have no effect today. Treat per-dashboard privacy and alert toggles as coming later, not as live settings.

Tabs: keep several dashboards open at once

A row of dashboard tabs across the top of the Dashboards page. Each tab shows a dashboard name with a close control, and a plus button opens a dialog to add another dashboard to the tabs or create a new one. Tabs can be dragged to reorder.
Tabs let you pin several dashboards side by side and switch between them quickly.
  • Add a hidden dashboard to the tab bar, or create a brand-new one, from the add-tabs dialog.
  • Reorder tabs by dragging, rename a tab (with edit permission), and close a tab to hide it from the bar (closing a tab does not delete the dashboard).

The Grid: Adding, Arranging, and Saving

Widgets live on a responsive 12-column grid. With edit permission you can drag, resize, and group them. Without it, the dashboard is view-only.

A dashboard in view mode with a mix of widgets: a gauge showing a current temperature, a line chart over time, a data table, and a floor-plan map with colored pins. Each widget has a header with its title.
A dashboard in view mode. Each tile is one widget.
A dashboard in edit mode. One widget is mid-drag, held by a drag handle in its header, and another shows a resize handle at its bottom-right corner. A faint grid is visible behind the tiles.
Edit mode: grab a widget by its drag handle to move it, or pull a corner to resize.

Layout behavior

BehaviorDetail
Columns12 columns on desktop sizes (large, medium, small). On phones the grid collapses to a single column so every widget stacks full width.
MoveDrag a widget by the handle in its header. Widgets can overlap while you are editing.
ResizePull the corner. New widgets drop in at the next free spot at a standard starting size, then resize freely. Auto Align gives each widget a sensible size for its type: gauge, label, progress, pie, and doughnut snap to a small square; line/bar/area/scatter charts to a wider rectangle; tables and maps to a full-width block.
SpacersAdd spacer drops a full-width divider that splits the dashboard into vertical sections (for example “KPIs” above, “History” below). Auto Align respects these sections.
The dashboard toolbar with a Create widget button, Add spacer, Undo and Redo, Full screen, Auto Align Widgets, Refresh Dashboard, a gear settings menu (Edit, Duplicate, Delete), and a small autosave status indicator reading Saved · just now.
The dashboard toolbar, left to right: Add widget, Add spacer, Undo, Redo, Full screen, Auto Align, Refresh data, and Dashboard config (the gear menu). Layout changes save automatically; Undo and Redo cover moves, resizes, adds, and deletes.

Saving, autosave, and history

  • Autosave: layout changes (moves, resizes, spacer edits) persist automatically. A small indicator shows Saving…, then Saved · just now, and warns if a save failed and will retry.
  • Auto Align Widgets packs widgets tightly into a clean grid, section by section, in one action.
  • Refresh Dashboard re-pulls data for every widget on demand.
  • Undo / Redo covers layout commits plus adding and deleting widgets, up to the most recent 20 actions on the current dashboard.
  • Full screen expands the dashboard for a wall display. When several dashboards are open as tabs, previous/next arrows flip between those open dashboards.

Live Data

Widgets update themselves. The dashboard opens an authenticated WebSocket connection and keeps every widget current as new readings arrive.

How “live” works: when a widget mounts it requests the data it needs. The dashboard then does an incremental refresh every 10 seconds, pulling only what is new. Single-status, multi-status, and “latest” charts refresh on the fast cadence; longer historical charts refresh on a slower beat. If the connection drops it reconnects on its own (it pings every 30 seconds and retries up to 10 times), then re-requests data for every widget.
  • Charts request a time window (Live or Daily) and stream a series of readings.
  • Single-status widgets (gauge, label) request the latest reading only.
  • Multi-status widgets (table, map, progress, pie, doughnut) request the latest value per bound attribute.
When an attribute stops reporting: nothing breaks. The widget keeps showing the last value it received until a newer reading arrives. A widget whose device or attribute has no data in the requested window simply shows No Data Available rather than an error. Charts only plot numeric values; string and boolean attributes appear as a latest reading but cannot be graphed.

Widget Data Binding

Every widget is built from one or more Attributes (data points). Each attribute row ties a device to one of its measurements, with a few display options.

FieldWhat it does
DeviceSearchable picker. Type to find a device by name. Required for each attribute row.
AttributeThe measurement to show. The list fills only after a device is chosen, and reflects that device’s auto-detected attributes.
StatisticCharts only: how to reduce a window of readings into one aggregated point. Options are Max, Min, Average, Sum, Max absolute, and Min absolute (the default is Max absolute). Hidden when a chart is showing Raw data, since there is nothing to aggregate. Status and multi-status widgets do not show a Statistic.
ColorThe series, slice, or value color for this attribute. (No Color picker on a Map data point, and it is hidden on a Gauge once Advanced color settings is on.)
Decimal places0 to 4 decimal places for the displayed value. Shown only on Single Status (Gauge, Label) and Table attributes; the default is 1.
Unit (temperature only)For a temperature attribute, a quick toggle between Celsius (°C) and Fahrenheit (°F).
Limits per type: a Single Status widget (gauge or label) accepts exactly one attribute (“Single status widgets can only have one device attribute.”). Chart and Multi-status widgets accept several. You cannot add the same device-and-attribute twice to one widget (“The same Device Attribute exists.”). Saving with no attribute is blocked: “At least one device attribute is required.”

Building a Widget

The widget editor has a config panel on the left and a live preview on the right, so you see the real thing as you set it up.

Create Widget dialog with two tabs across the top: Create Widget (build from scratch) and Import map (add a map widget that mirrors a map from this application's Map page). The Import map tab only appears when you are inside an application.
Starting a widget. From an application a second tab lets you import an existing map.
  • 1
    Enter a Widget Title (required) and pick the target Dashboard (hidden when you are already inside one).
  • 2
    Choose a Widget Type: Chart, Single Status, or Multi Status. Then choose a Style (the sub-type) within that type.
  • 3
    Set the type-specific options (time range, scale, table cells, and so on), then add one or more Attributes.
  • 4
    Watch the Preview, then save. The widget drops onto the dashboard at the next free spot.

The Widget Catalog

There are three widget types, each with several styles. The type identifiers are chart, single_status, and multi_status; each style has its own sub-type identifier shown below.

TypeStyles (sub-type id)
Chart (chart)Line (line), Bar (bar), Area (area), Scatter (scatter)
Single Status (single_status)Gauge (gauge), Label (label)
Multi Status (multi_status)Table (table), Map (map), Progress (progress), Pie (pie), Doughnut (doughnut)

Chart — Line, Bar, Area, Scatter

What it shows: one or more attributes plotted over time. Use it for trends, comparisons across devices, and history. Charts plot numeric values only.

Chart widget configuration: a Display Type select (Live or Daily), an aggregation interval select, an X-axis range box with Max points and an optional display range, and a Y-axis range box with Minimum value and Maximum value inputs.
Chart options: choose Live vs Daily, the aggregation interval, and the axis ranges.
OptionWhat it does
StyleLine, Bar, Area, or Scatter.
Display TypeLive (a rolling relative window) or Daily (a rotating day-based window). For Daily, the Duration select picks which day to show: Today, Yesterday, Two days ago, or Three days ago.
Source DataThe aggregation interval: Raw, 1-minute aggregation, 5-minute aggregation, 10-minute aggregation, 30-minute aggregation, 1-hour aggregation, or 3-hour aggregation. Daily charts cannot use Raw. With Raw selected, the per-attribute Statistic is hidden.
X-axisFor Live, Max points caps how many points are drawn (up to 1440) and an optional Display range sets how far back to look (a number plus seconds / minutes / hours / days). For Daily, the Duration day-selector above sets the window.
Y-axisMinimum value and Maximum value. Leave both blank for Auto. If you set one you must set the other, and the max must be greater than the min.
AttributesOne or more device attributes, each with a Color and (when aggregating) a Statistic.

Single Status — Gauge

What it shows: a single device’s latest value as a dial against a min/max range. Use it for “current temperature”, “current CO₂”, and similar at-a-glance KPIs. Exactly one attribute.

Gauge configuration: Minimum value and Maximum value inputs, a Gauge direction select (Minimum to Maximum or Maximum to Minimum), a Show scale checkbox, and an Advanced color settings section that adds threshold rows each with a target value, gauge color, and text color.
Gauge options, including optional threshold color bands.
OptionWhat it does
Minimum value / Maximum valueThe gauge’s scale ends, entered as whole numbers. Min defaults to 0, max to 100. Both are required, and min must be less than max.
Gauge directionSweep Minimum to Maximum or Maximum to Minimum.
Show scaleDraw the numeric tick marks around the dial.
Advanced color settingsTurns on optional threshold bands for the attribute. Each row pairs a target value (shown as ≥ Target value for a Minimum-to-Maximum gauge, or ≤ Target value for Maximum-to-Minimum) with a Gauge color and a Text color, so the dial recolors as the value crosses each threshold. Add rows with the plus button; the first row’s threshold is fixed to the gauge min (or max) and cannot be removed. Each threshold must stay within the min/max range and follow the gauge direction. (With this on, the attribute’s normal Color picker is hidden.)
Decimal places0 to 4 on the displayed value (default 1).

Single Status — Label

What it shows: the latest value as plain text with its unit. Use it for compact readouts and for non-numeric attributes (status strings, on/off states) that a gauge cannot show. One attribute.

  • Decimal places (0 to 4) for numeric values.
  • Color for the value.
  • Handles string and boolean values, which is why it pairs well with categorical attributes.

Multi Status — Table

What it shows: a grid of latest values, one attribute per cell. Use it to lay out related readings (for example one row per room, one column per metric).

Table widget configuration: selectors for Number of Rows and Number of Columns, a Show table labels toggle, editable row and column label inputs, and on each attribute row a Cell picker that assigns the attribute to a labelled cell such as A1 or B2.
Table options: size the grid, label the rows and columns, then drop each attribute into a cell.
OptionWhat it does
Number of Rows / ColumnsGrid size. Rows up to 16, columns up to 8, capped so total cells stay at or under 16 (more rows means fewer columns allowed).
Show table labelsToggle the row and column header labels on or off.
Row / Column labelsEditable text. Defaults are letters for columns (A, B, C…) and numbers for rows (1, 2, 3…).
Cell (per attribute)Each attribute row gets a Cell picker (A1, B2, and so on) that places it in the grid. Every attribute needs a cell, and two attributes cannot share a cell.
How the table is stored (the non-obvious bit): the table’s shape lives on the widget as options.tableLabel, which holds the column labels and row labels ({ "colum": ["A","B"], "row": ["1","2"] }). Each attribute then carries its own placement in options.tableIndex, stored as a JSON string of [row, column] indices (for example the string "[0,1]" means row 1, column B). So a complete table widget needs both: options.tableLabel on the widget for the grid, plus a per-attribute options.tableIndex string for where each value sits. If the grid is resized smaller, any attribute pointing at a cell that no longer exists has its tableIndex cleared, and you re-assign it.

Multi Status — Map

What it shows: device pins placed on an uploaded floor plan or site image, colored by attribute. Use it for spatial monitoring (a floor of sensors, a site map).

Map widget configuration: an Upload image control for the floor plan with a warning that the image is required, toggles for an Information window and a Filter window, an Advanced Settings toggle, and per-attribute controls for an icon Category, X and Y position sliders, and an optional on-click history chart.
Map options: upload a floor image, then place each device’s pin with an icon and position.
OptionWhat it does
Map image (Upload image)Upload a PNG, JPEG, or WebP floor plan or site image. Required — a warning reads “Map image is required.” and the widget will not save without one.
Window: InformationToggle an on-map info panel for the selected pin.
Window: FilterToggle an on-map filter control.
Advanced SettingsUnlocks per-pin extras: a Use label checkbox that reveals a label-text field, a Place value switch with a Label position (Center, Top, Bottom, Left, Right), and a Related widget select that links the pin to another widget on the dashboard bound to the same device and attribute.
Category (per attribute)The pin icon, chosen from a “Select a category” menu: Air Flow, Temperature, Humidity, CO₂, Acceleration, Door (open/close), Brightness, Motion, Occupancy, and Other. Required per pin.
Icon-x / Icon-y (per attribute)Place the pin from 0 to 100 across and down the image, via a number input or a slider.
Show Chart on Click (numeric attributes)Optionally show a small history chart when a numeric pin is clicked, with its own style, Live/Daily duration, aggregation interval, Y-axis, and color.
Imported maps and the per-dashboard cap: inside an application you can import an existing application Map as a map widget that mirrors that map’s pins and layout (this links the widget to the map via appMapId). A single dashboard can hold up to 16 map widgets; adding more than that is rejected.

Multi Status — Progress

What it shows: progress bars toward a target, per attribute. Use it for “X of max” style readouts (people counted vs capacity, output vs goal).

Progress widget configuration: an X-axis Type select offering Time Scale or Numeric Scale, and when Time Scale is chosen, a 24-hour scale checkbox.
Progress options: choose a time scale or a numeric scale.
OptionWhat it does
X-axis TypeTime Scale or Numeric Scale.
24-hour scaleFor Time Scale, fix the axis to a full 24-hour span.
Per-attributeEach attribute can carry a task name, a target total, and a start/end time range (time scale) or start/end number range (numeric scale).

Multi Status — Pie and Doughnut

What it shows: a share-of-total breakdown across attributes. Pie is a filled circle; Doughnut is the same with a hole in the middle. Use them for composition (share of devices by state, contribution to a total).

Pie and doughnut widget configuration: a Text color picker for the labels, a Sort by value (descending) checkbox, and a Show labels outside checkbox.
Pie and doughnut options: label color, sorting, and label placement.
OptionWhat it does
Text colorColor of the slice labels.
Sort by value (Descending)Order slices largest to smallest.
Show labels outsidePlace value labels outside the ring instead of on the slices.
Per-attributeEach attribute is one slice, with its own Color and an optional slice label name.

Plan Limits

Each plan card in Billing lists a Dashboards allowance for the workspace, which may appear as a specific number or as Unlimited depending on your plan; there is no separate per-widget cap surfaced in the product. The limits that always apply are structural and are covered with each widget above: up to 16 map widgets per dashboard, and up to 16 cells per table widget (up to 16 rows and 8 columns, capped at 16 cells total).

Leave a Reply

Your email address will not be published. Required fields are marked *

Open external link

You’re leaving Claude to visit an external link:
https://stg-app.env-neqtoai-staging.kinsta.cloud/en/dashboards