Funnel Chart
Shows where a process loses volume: each stage is a band whose width follows its value, in the order you configured, with the value and the percentage on it. The title row carries the conversion from the first stage to the last, and a hover tells you what share of the previous stage survived and how much was lost. Colors shade down the funnel or follow your own thresholds.
Funnel Chart
Shows where a process loses volume. Each stage is a band whose width follows its value, drawn in the order you configured, with the value and the percentage on it. The title row carries the conversion from the first stage to the last, and a hover tells you what share of the previous stage survived and how much was lost between the two.
Features
- Stages drawn in the configured order, because the order of a funnel is part of its meaning
- Conversion from the first stage to the last in the widget title row, with both values beside it
- Percentage on every stage — share of the first stage, or share of the previous one
- Tooltip with the value, both shares, and how much was lost since the previous stage
- Dark-to-light shading down the funnel, or your own value thresholds
- Labels inside the stages, or outside with leader lines when the lower stages get too narrow
- A stage that counted zero keeps a visible, labelled band instead of collapsing to a line
Stage clickaction source- Units and decimals taken from the data key
Data keys
A stage is one data key. Two shapes work, and the widget picks the naming automatically:
- One entity, several keys — the common case. Add one datasource and a key per stage; stage names come from the key labels.
plannedOutput,started,produced,passedQa,shipped. - Several entities, one key each — when every stage is its own device or asset. Stage names come from the entity labels.
If both vary, the stage is named entity · key.
- any numeric timeseries keys (timeseries, number) — one per stage. No fixed names.
The keys’ units and decimals format every value on the stages, in the tooltip and in the title row.
Negative readings are clamped to zero, since a band cannot have negative width. A stage with no readings in the window counts as zero rather than vanishing — in a funnel, “nothing got through” is a result, not missing data.
Aggregation
The widget reads only the dashboard time window and collapses the readings of each key into one number.
| Option | Use it for |
|---|---|
| Latest value | a counter the device keeps for the period — producedToday, shiftGoodParts. The default |
| Sum of the readings | keys that carry one reading per event, to be added up over the window |
| Highest reading in the window | the same counters, when a device restart can make the counter dip mid-window |
Averages and minimums are deliberately not offered: a funnel stage is a count of things that got through, and an average of a counter describes nothing you would put in a funnel.
Configuration
Value — the aggregation above, and whether large numbers are shortened to 12.4k.
Stages — the order (as configured, largest first, or smallest first), alignment, the gap between bands, the narrowest width — which sets both the band an empty stage keeps and how sharply the funnel tapers below the last stage — and the coloring mode with its base color. Shading follows the position in the funnel rather than the value, so two nearly equal stages still read apart.
Labels — inside the bands or outside with leader lines; whether the value appears; whether the percentage is measured against the first stage or the previous one; fonts for the name and the value; text color, which is picked black or white per stage automatically while left empty.
Conversion — whether the conversion and the time window appear in the title row, plus their fonts and colors. The widget never shows a sum of the stages: adding “started” to “finished” would count the same units twice.
Tooltip — whether it appears, plus its font, text color and background.
Widget title, background, padding and margins come from the widget’s own Appearance settings, and the platform’s Data settings block is hidden — units, decimals and the empty state are handled by the widget and the data key.
Thresholds
Shown once Stages → Color is set to By thresholds. Each row is a From value, an optional To value and a color, in the units of the data key.
- Leaving To empty runs the row up to the next row’s From; on the last row it means no upper limit.
- An inferred upper bound is exclusive and one you typed is inclusive, so two neighbouring rows never both claim a boundary value.
- A value outside every range keeps the base color.
The widget ships with three example ranges to replace with values that suit your data:
| Range | Color | Meaning in the example |
|---|---|---|
| 0 – 100 | red | below target |
| 100 – 500 | amber | approaching target |
| 500 and above | green | at or above target |
Reading the shape
Band width is proportional to value, so a stage wider than the one above it is drawn wider — the shape stops being a funnel and shows you that more left a stage than entered it. That is usually a sign the keys are in the wrong order, the aggregation does not match how the device reports, or two keys count different things.
Sorting by value hides that: it always produces a tidy funnel, but the step percentages then describe a ranking instead of your process. Keep As configured unless you actually want a ranking.
Actions
Stage click is exposed as an action source: configure it under the widget’s Actions tab, most often as Navigate to new dashboard state. The action receives the entity, its name, and the stage’s name, index, key, value and both shares.
Contact it-novum GmbH
If you any questions or inquiries, please feel free to contact us: https://data.it-novum.com/
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.