SVG Accessibility/School Graphs
The sort of thing that school kids might understand.
Basic Bar, Line and Pie charts
3 graphs. A horizontal bar chart and two pie charts. One of the Pie charts uses the same categories as the Y axis of the bar chart - genres of writing - but the values don't match. The other Pie chart uses a few US states for categories, and otherwise appears to be unrelated.
A grouped bar chart. The Y axis is numeric, describing revenue, the X-axis contains 4 clusters of 5 bars each. The clusters represent the source of orders (web, phone, etc) groups, the individual bars, colour coded and identified by a legend, represent different types of product.
Good Practice examples
- Separation of different types of information
- Visually the clusters are well-separated, which helps to interpret them "at a glance", unlike some other bar graph examples we have. Having the clusters run together makes it harder to identify when a given cluster begins and ends.
Another example of a bar chart with multiple layers of information. The Y axis is numeric, the X axis is divided first into male and female, in each part that is divided into yes and no, each of those is divided into web and phone, and each of those is divided into 2 types of product, with bars in 4 colours representing the two product groups differently for web/phone but repeating across the further divisions.