Skip to content
Stand with Ukraine flag

Dynamic entity metrics view

  • Widget
  • 56 installs
  • v1.0.0
  • Jul 20, 2026
  • MIT license
  • v4.2+
Dynamic entity metrics view

Combines a scrollable column of metric cards with a synced time-series chart in one widget, so current readings and recent trends for the same entity show together.

Widget Type
  • Timeseries
Category
  • Cards & Info
  • Charts & Graphs
Use Cases
  • Air Quality Monitoring
  • Asset Tracking
  • Smart Metering
  • Smart Office
  • Tank Level Monitoring
  • Smart Energy

Who it’s for

Anyone building a device dashboard who wants both today’s numbers and today’s trend in one place asks “can I see the current reading and the shape of its last few hours without lining up two separate widgets?” A plant operator wants a machine’s live temperature and pressure as big numbers, with the same signals trending on a chart right beside them. A dashboard builder wants one widget instead of stitching a card row and a chart together and keeping their time windows in sync.

What it does

A temperature key added as an Additional latest value renders one card reading 72.4°F with an icon tinted from that key’s own Color; a humidity key added as a regular Timeseries key instead becomes a line on the chart beside it — from a single widget, in one glance you get today’s numbers and today’s trend.

  • Cards and a time-series chart share one widget — a scrollable column of metric cards sits beside the embedded chart, so current readings and their trend are visible together
  • Which key list a key is added to decides what it becomes — regular Timeseries keys plot on the chart, Additional latest values keys each become one card
  • Each card gets its own icon, tinted from that key’s own Color, with a faint matching background computed automatically
  • An optional “last updated” line on each card, shown in 24-hour time
  • The chart is the native ThingsBoard Time Series Chart, so anything it already supports — legend, axes, tooltip formatting, thresholds — comes with it
  • Shows current readings and recent history side by side; a key drives either a card or a chart series, never both from the same entry

How to set up

Data keys

KeyRoleTypeDescription
Timeseries keys (any number, regular Data tab list)Chart seriesTimeseriesPlotted on the embedded chart only, using the same per-key settings as the native Time Series Chart widget (color, units, decimals, line style)
Additional latest values keys (any number, separate Data tab list)Metric cardTimeseries or AttributeOne card per key, in the order added

This widget uses two separate key lists on the Data tab, not one shared list with a per-key toggle: keys added as ordinary Timeseries keys plot on the chart only, and keys added under Additional latest values each become one card. A key never appears in both panels at once. With no card keys, the cards column is simply empty; with no chart keys, the embedded chart still renders and falls back to its own no-data state.

Card appearance

Configured per key, on Additional latest values keys only.

SettingDefaultEffect
IconinfoThe icon shown on that key’s card
Display last updated timeOffAdds a “last updated” line under the value, in 24-hour time

A card’s icon color, and the faint tint behind it, follow that key’s own native Color setting on the Data tab — the same Color a chart key uses for its line — so there is no separate icon-color field. A key with no Color set falls back to a plain gray icon.

How to customize

  • To style the chart — use the widget’s Appearance tab; every setting there (legend, axis labels, tooltip formatting, thresholds, and so on) is identical to the native Time Series Chart widget’s own settings.

Tips

  • If a card or a chart line seems to be missing, check which key list you added that key to — a metric meant for a card that landed in the regular Timeseries list will only ever show up as a chart line, and the reverse is true too.
  • There is currently no way to set a card’s value/units text color from the settings panel, even though the underlying config carries a field for it — if you need a specific color there, it is not reachable from the UI today.

Share Your Widget with the Community

Built a custom widget? Export it as a JSON from ThingsBoard and publish it to the IoT Hub through a simple 4-step wizard (Upload, Listing, Readme, Review & Submit). Share it with thousands of ThingsBoard developers worldwide and get featured in the catalog.