Skip to content
Stand with Ukraine flag

Comparison table

  • Widget
  • 1 install
  • v1.0.0
  • Sep 17, 2026
  • MIT license
  • v4.2+
Comparison table

One row per entity, and every row says how it stands against the others rather than only against itself. A value, a bar for its share of the total, a line showing the shape of the period and the change across it, all sortable by clicking a heading. Built for the dashboards that ask which site, line or feeder is the outlier — where a grid of identical cards makes you read twenty numbers and hold them in your head to answer one question.

Widget Type
  • Timeseries
Category
  • Tables & Lists

Who it’s for

Anyone responsible for more than one of the same thing. An energy manager with eight production lines, a facilities lead with a dozen buildings, a service provider with forty sites on the same contract. They are not asking what any one of them is doing — a card answers that — they are asking which one is the outlier, and a grid of identical cards makes you read twenty numbers and hold them in your head to find out.

What it does

Five lines on one meter key. Extruder 3 drew 4 280 kWh this shift, a quarter of the site’s total, and its trend line climbs; Extruder 2 drew 2 760 and has fallen away by nearly a fifth. Two facts that take a paragraph to write are one glance in the table, and clicking Total re-ranks it.

  • Puts a value, its share of the total, the shape of its period and its direction on one row, so entities are read against each other rather than in turn.
  • Draws the share as a bar, because a number says how much and a bar says how much compared with everyone else.
  • Shows the shape of each series as a small line with no axis and no numbers. A flat line and a sawtooth with the same average are different conversations.
  • Sorts by any column on a click, so the same table answers “who is largest” and “who moved most” without being reconfigured.
  • Pages the rows rather than scrolling forever, so a table of four hundred entities opens as quickly as one of four.
  • Compares entities on one key. For several keys on one entity, put several of these side by side, or use a chart.

How to set up

Data keys

Add one datasource per entity, each carrying the same single key.

  • One key per entityTimeseries or Attribute. The value being compared. The entity name becomes the row. Decimals and units are taken from the key, and a row whose key has no reading in the window is left out rather than shown as zero.

Readings are ordered by their timestamps rather than by the order they arrive, so the latest value, the direction and the trend line are right whichever way the platform sends them.

Columns

  • How each row’s value is taken from the time window — latest value by default. Latest compares where everything stands now. Sum compares what each contributed over the period, which is what a consumption or output comparison wants. The column header names whichever you pick.
  • Show each row’s share of the total — on by default. A bar and a percentage of the total across every row.
  • Show the shape of each series — on by default. The trend line.
  • Show whether it is rising or falling — on by default. The same measure over the second half of the window against the first half, so the comparison is always the same kind of number as the column beside it.
  • How the change is expressed — percentage of the earlier half by default. A percentage travels between rows of different magnitudes; absolute units are what an operator acts on.
  • Show the total beside the title — on by default. The total the shares are shares of.

How to customize

  • To change what the trend line is measured against — set What the trend line is scaled against. Each row’s own range shows every shape equally, which is usually the point; one shared range makes the lines comparable in height, at the cost of flattening every small series into a straight line. Trend line, Shade under the trend line and Mark the high and low points style it.
  • To open on a different order — set Column the table opens sorted by and Open smallest first. Whoever opens the dashboard sees this first, so it should answer the question they came with.
  • To stop the table being reordered — turn off Let the reader sort by clicking a header, which is worth doing on a wall display where a stray click would reorder a table nobody is standing at.
  • To fit more or fewer rows — set Rows per page, or turn off Split the rows into pages to let the whole list scroll. Paging is easier on a long list, where every row draws its own trend line.
  • To flip the colors for a cost — turn off A rise is good news. It decides the color of the change column only, never its direction, so on a table of spend, scrap or downtime a rise reads as bad. Change in the good direction and Change in the bad direction set the two colors.
  • To match a dashboard’s palette — set Share bar, Row text and Headers and secondary text. Row font sets the size of everything in the table; headers and shares follow it.
  • To separate the rows more strongly — turn on Shade alternate rows. Off by default, because the platform’s own tables separate rows with a hairline and stripes fight the share bars.

Tips

  • Use the sum over the window when comparing consumption or output, and the latest value when comparing state. Ranking eight lines by their latest instantaneous reading says which happened to be busy at that second, not which did the work.
  • Sort by the change column once a week. The largest consumer rarely changes, so the table sorted by value tells you the same thing every time; sorted by movement it tells you what is new.
  • Leave the trend line on its own range unless the magnitudes are the point. On a shared range a site drawing a tenth of its neighbor’s load becomes a flat line, and whether it is steady or erratic is exactly what you lost.
  • Pair it with a chart on the same dashboard and wire a row click to a dashboard state carrying the entity, so the table picks the outlier and the chart explains it.

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.