Graphs/Bar Chart
Edit src/renderers/d3/comparison/bar.ts and save to see changes across all configurations
Tests: 52Sections: 6
Container SizesSame 6-item dataset, different container dimensions
Tiny250×160 · 6 rows
Small350×220 · 6 rows
Medium500×320 · 6 rows
Large700×420 · 6 rows
Wide800×250 · 6 rows
Tall300×500 · 6 rows
Tiny Horiz300×180 · 6 rows
Large Horiz700×400 · 6 rows
Dataset SizesVarying row count
3 items500×320 · 3 rows
6 items500×320 · 6 rows
12 items500×320 · 12 rows
20 items600×320 · 20 rows
30 items700×320 · 30 rows
50 items900×350 · 50 rows
3 horiz500×200 · 3 rows
12 horiz500×400 · 12 rows
25 horiz500×600 · 25 rows
Config VariationsSame 8-item dataset, different config options
Default450×300 · 8 rows
Sort Asc450×300 · 8 rows
Unsorted450×300 · 8 rows
With Labels450×300 · 8 rows
Color by Cat450×300 · 8 rows
Custom Colors450×300 · 5 rows
No Title450×300 · 8 rows
Horiz + Labels500×350 · 8 rows
Edge CasesStress tests — unusual data shapes and values
Single Item400×280 · 1 rows
Two Items400×280 · 2 rows
Long Labels500×350 · 6 rows
Long Labels Horiz550×350 · 6 rows
Huge Values450×300 · 5 rows
Tiny Values450×300 · 5 rows
Zeros Mixed450×300 · 5 rows
Same Values450×300 · 4 rows
Wide Range450×300 · 5 rows
Color SystemNamed palettes, color schemes, and highlight mode
Default (Categorical)450×300 · 8 rows
Green Palette450×300 · 8 rows
Purple Palette450×300 · 8 rows
Warm Palette450×300 · 8 rows
Traffic Light450×300 · 3 rows
Profit/Loss450×300 · 3 rows
Highlight: Echo450×300 · 8 rows
Highlight: Charlie (Muted)450×300 · 8 rows
Multi-Highlight: Delta & Golf450×300 · 8 rows
Multi-Highlight: 3 Values450×300 · 10 rows
Horiz + Green Palette500×350 · 8 rows
Horiz + Highlight500×350 · 8 rows
Date CategoriesUsing dates as categorical x-axis values
Monthly Revenue600×320 · 6 rows
Quarterly500×300 · 4 rows
Week Days500×300 · 7 rows
Yearly Trend700×320 · 6 rows
Date Strings700×300 · 6 rows
Months Horiz500×400 · 6 rows