Scenario Services Components
light
IChart — Bar Charts
Set type="bar" to switch from line to bars. Bar charts support
  • stacking
  • grouped stacks
  • per-dataset color overrides
  • year filtering
  • relative view
  • full download / toolbar slot API
The stacked prop enables stacked mode; datasetOptions.stack controls which datasets share a stack group.

Basic Bar Charts

Basic bar chart
Set type="bar" to render grouped bars. The legend works identically to line charts: clicking a legend entry toggles that dataset's bars on/off. Use years to limit the x-axis to specific years.
Custom bar colors & download
Override individual bar colors via datasetOptions.color . The download prop (default true ) shows an export menu in the toolbar for PNG image and CSV data exports.

Stacked Bar Charts

Stacked bars
Add the stacked prop to stack all datasets into a single bar per x-tick. Ideal for visualizing part-to-whole relationships over time.
Stacked + relative view
Combine stacked with :allow-relative-view="true" to get a 100% stacked chart when the user toggles to relative mode. Use relative-view-y-label to update the axis label accordingly.

Grouped Stacked Bars

Set datasetOptions.stack to a string key to group datasets into independent stacks that sit side-by-side within each x-tick. Datasets sharing the same stack key are stacked on top of each other; different keys form separate groups.

Two regions, three scenarios each — grouped by region
Each region forms its own stack group. Within each group, the three SSP scenarios are stacked. Color hue identifies the region; lightness differentiates scenarios within a group.

Bar Chart + Selectable Dimension

Selectable region on a stacked bar chart
The selectable prop works with bar charts too. The inline region dropdown in the subtitle re-fetches data whenever the user switches regions, keeping the stacked bars updated without a page reload.