React chart example
Unit chart
Show counts as repeated icons, one per unit.
What is a unit chart?
A unit chart represents each observation — or each fixed group of observations — as its own mark, so the count is read by counting rather than by measuring a length.
When to use it
Use it for small counts where the individual matters: people affected, teams, incidents. It makes quantity concrete and humane where a bar makes it abstract. Use a bar chart once the counts run into the hundreds.
Design tips
Say what one unit represents, and keep it a round number.
Arrange units in a regular grid so partial rows are easy to read.
Use one shape; varying the icon adds an encoding you did not intend.
Build this chart in React
Compare with
Use for compact part-to-whole percentages on a regular grid.
Use once counts are too large for individual marks.
Graphy Chart SDK
Add Graphy’s unit charts to your React app.
Ship quickly with one maintained SDK, without building and maintaining the entire charting experience yourself.