Skip to main content

What progress bars show

Planningboard renders two levels of progress bar when capacity load visualization is enabled:
  • Column header bars — appear in the calendar header above each Plan column and aggregate all work items in that time period across every swimlane.
  • Cell bars — appear inside individual Planningboard cells and show progress for a specific swimlane–Plan intersection.
Each bar is divided into up to four colored segments, one per status category: Each segment displays a numeric count label showing exactly how many work items belong to that category. When all status counts are zero, Planningboard automatically falls back to the default four-segment bar to prevent an empty or confusing visualization.
Plan column header showing a multi-segment progress bar with green, salmon, orange, and teal segments and numeric work-item counts
Column header bar for Plan Sprint 12 with Done, Todo, and Invalid segments, and a cell bar for Team Alpha x Sprint 12 with Done and Todo segments
Hovering over a progress bar shows a tooltip with the full status breakdown — this is useful when segments are too narrow to read the count labels clearly.
1

Enable capacity load visualization

Progress bars are only rendered when capacity load is turned on for the widget. Open the widget parameters for your Planningboard and set capacityLoad to true:
Default value: falseSave the widget and reload the page. Column header bars will now appear above each Plan column.
If your Plans use mixed calculation types (for example, some using remaining estimate and others using time-spent), the totals shown in progress bars will be incorrect. This is a non-obvious requirement — configure all Plans in the project to use the same calculation type before enabling capacity load visualization. See Configure Capacity Tracking for details.

2

Choose the capacity mode

Planningboard supports three capacity modes that affect how progress bars are calculated and where they appear.

Single (column-level) capacity

The default when capacityLoad = true. A single progress bar appears in each Plan column header. All swimlane cells share the same column total.

Per-resource (cell-level) capacity

Set multiCapacityLoad = true to render a separate progress bar inside each swimlane cell. Each cell shows its own capacity progress independently of other cells in the same column.
Use this mode when different swimlanes (for example, different assignees or teams) have different capacity allocations and you want per-cell visibility.
Planningboard cells showing per-resource progress bars: a green bar for Done items and a purple bar counting all other items as Todo

User capacity

Set userCapacityLoad = true together with Teams Service integration to load per-user capacity values from the Teams Service:
The useTeamsService = true property unlocks per-swimlane capacity visualization when combined with userCapacityLoad. Without it, individual user capacity data is not available to the board. See Set Up Teams Service for the Teams Service prerequisite setup.

3

Set the capacity field

Tell the board which work-item field holds the effort value used to calculate how full each progress bar segment is:
Replace storyPoints with your project’s field ID (for example, estimate, timeSpent, or a custom field ID). If capacityField is not set, Planningboard uses the default effort field.Also confirm the number of working hours per day used in capacity math:
Default: 8
4

Verify the result

After saving all widget parameters, reload the board. You should now see:
  • Colored progress bars appearing in the calendar header above each Plan column.
  • Numeric labels inside each segment showing the item count for that status category.
  • (If multiCapacityLoad = true) Individual progress bars inside each swimlane–Plan cell.
  • A detailed status breakdown tooltip when hovering over any bar.
If bars appear but all segments are gray, check that your work items have recognized status values that map to the Done / Todo / Invalid / Rejected categories. If all segments read zero and the bar reverts to the default four-segment display, there are no work items in the queried Plans — verify your Plan query and work-item query parameters.

Configuration example

The following widget parameter block shows a complete capacity-enabled configuration for a team board where each assignee swimlane needs its own capacity bar:
For a Teams Service-integrated board with per-user capacity:
Capacity configuration parameters are whitespace-sensitive. Do not add leading or trailing spaces around the = sign or the values. A value like capacityLoad = true (trailing space) may not be parsed correctly and will silently produce no progress bars.

Known limitations

  • Progress bar coloring is based on work-item workflow status categories only. Custom enumeration fields cannot be used to color-code progress bar segments. This is a current product limitation — users migrating from Nextedy SCRUMBOARD should be aware that SCRUMBOARD’s custom-enum coloring is not available in Planningboard.
  • Multi-assignee work items and sub-item effort distribution are not reflected in capacity bars. Each work item’s effort is counted once under its primary assignee. See Capacity Calculation Issues if totals look unexpected.
  • The PARENT swimlane assignment mode does not support planCellsMode; cell-level bars are not available in that configuration.

See also

KB Articles
  • Planningboard: Customizable Statistics and Capacity Indicators
  • Planningboard interface & basic interactions
  • Customize the content of the card
Support TicketsSource Code
  • customProgressBar.cy.ts
  • customProgressTooltip.cy.ts
  • viewLicense.vm
  • PlanningBoardWidgetRenderer.java
  • planningboard.js
Last modified on July 9, 2026