CH-PTW-02 . family PTW
STACKED BAR 100%
vertical 100% stacked bar. Needs:
ordered categories + 2 to 4 additive segments; totals normalized away.
part-to-wholesharechange-over-time
DL-01 AGRAW
DL-02 KATA
DL-03 LOGOS
DL-04 SHILPA
DL-05 OBEYA
DL-06 LEX
DL-07 SAGA
DL-08 SENTINEL
DL-09 ATLAS
DL-10 BASIRA
DL-11 SUTRA
DL-12 NOROSHI
DL-13 MIZAN
DL-14 EVIDENTIA
DL-15 ABRID
DL-16 TELOS
Use when
- how the MIX shifts across periods or categories
- the key segment's share is the message
- 2 to 4 additive segments
Do not use when
- the total matters (use CH-PTW-01; 100% hides growth and shrinkage)
- more than 4 segments
- single-period share (a sentence or CH-PTW-06 does it better)
See instead
Alternatives
- CH-PTW-01 (absolute stacked)
- CH-PTW-06 (waffle, planned)
Rules
- all columns equal height; the mix is the message
- the key (first) segment's share labeled above each column with the % sign
- segments identified by swatch + name at the last column, never a legend
- 4 segments maximum
- the title must state the share shift, not the totals
Never do this
- using 100% stacked when totals shrink (it hides decline)
- legend boxes
- labeling every segment share (label the key segment only)
- more than 4 segments
QA before delivering
- columns equal height
- key segment share labeled with %
- segment names at last column, no legend
- title states the share shift
- source line present bottom-left
Data shape
| title | string, action title stating the share shift with a number |
| eyebrow | string caps, rendered only when the DL chrome asks for it |
| source | string, rendered bottom-left, always |
| unit | percent, implied; share labels carry the % sign |
| x | array of ordered category labels |
| series | array of {name, values[]}, first series is the KEY segment whose share is labeled |
Sample data (golden)
{
"title": "Delivered share climbed to 90%, up 12 points in four weeks",
"eyebrow": "PIPELINE MIX . WEEKS 25-28",
"source": "Source: sample dataset v1, 2026-07-12",
"unit": "%",
"x": [
"W25",
"W26",
"W27",
"W28"
],
"series": [
{
"name": "Delivered",
"values": [
812,
946,
1105,
1284
]
},
{
"name": "In transit",
"values": [
128,
110,
98,
96
]
},
{
"name": "Pending",
"values": [
96,
71,
54,
41
]
}
]
}