Combo Chart Component
The Combo Chart component places two or more series on the same chart with different visual treatments per series. The most common pattern is a bar series for period values (e.g., monthly cost) and a line series for a cumulative or rolling value (e.g., cumulative cost to date). Combo charts are also used for budget vs. actual comparison, planned vs. earned value, and resource loading with utilisation rate.
Required setup
| Property | Description |
|---|---|
| Category / date field | Shared X axis for all series. Typically a period or date field. |
| Series list | Each series in the combo chart. At least two series are required. |
| Series type per series | For each series: Bar, Grouped Bar, Stacked Bar, Line, Area, or Stacked Area. |
| Y axis assignment | Each series is assigned to the Primary (left) or Secondary (right) Y axis. |
| Aggregation | Sum, Average, Count, or Custom expression. Configurable independently per series. |
Dual-axis configuration
Dual-axis is the defining feature of the combo chart. To configure:
- Add a second series and set its Axis property to Right in the series editor.
- Configure the Left axis range, title, label format, and gridlines.
- Configure the Right axis range, title, and label format separately.
- Ensure the right axis range reflects the secondary measure's scale (e.g., percentage 0–100% rather than a cost scale).
Do not use dual-axis when the two measures are in the same unit and scale — use a grouped bar or overlapping line chart instead.
Series options
| Option | Description |
|---|---|
| Series name | Label shown in the legend. |
| Color | Custom hex color per series. |
| Series type | Bar, Grouped Bar, Stacked Bar, Line, Area, Stacked Area (set per series). |
| Line style | Solid, dashed, or dotted (for line and area series). |
| Line thickness | 1px–5px. |
| Markers | Show data point markers on line series: circle, square, diamond. |
| Data labels | Show the value at each plotted point. |
| Opacity | For area series, control the fill opacity to allow bar series to remain visible underneath. |
Common use cases
| Use case | Bar series | Line series |
|---|---|---|
| Cash flow curve | Monthly spend (periodic) | Cumulative spend |
| Budget vs. actual | Budget per period | Actual per period |
| Earned value | Earned value and actual cost bars | Planned value line |
| Resource loading | Resource hours per week (bar) | Utilisation % (line, right axis) |
| Progress tracking | Completed activities per month | Cumulative % complete (line, right axis) |
Reference lines
Add reference lines to mark targets or thresholds:
- Set a horizontal reference line at a budget cap, target, or baseline value.
- Reference lines can be static (fixed value) or dynamic (bound to a field).
Good practice
- Limit combo charts to 3 series. Beyond that, the chart becomes difficult to read and a data table may be more appropriate.
- If both series are bars, use a Grouped Bar chart instead of a combo chart.
- If the secondary measure is a percentage (e.g., utilisation %, % complete), always assign it to the right axis and format the axis as a percentage.
- Add a clear legend and axis titles so readers understand what each series represents without reading the chart caption.
Related
- Chart Component — single-type charts
- Cash Flow Curve — specialist cash flow component
- Earned Value — EV-specific component with pre-configured presets