In KeyLines 3.4, we responded to customer requests and included the ability to add donuts to nodes. Donuts are circular node borders divided into segments that add up to 360 degrees. They work just like pie charts and allow you to show nodes values as numeric proportions.
To help make sure your KeyLines visualizations are as clear and effective as possible, here’s a list of ‘Dos’ and ‘Don’ts’ when using donuts.
Donuts, like pie charts, work best when there are five segments or fewer. Crowding a single donut with more than 10 or 12 segments is likely to make your KeyLines chart confusing. Identify the 3 or 4 largest segments, and then group the remaining values together into a generic category. This helps your users focus on what’s important.
If you want to display details or a breakdown of what’s in each category, add tooltips to the hover event on each segment.
Color plays a big part in how humans interpret data. Donuts in KeyLines come with a default set of colors, but you can choose your own. If you do, follow these simple tips:
How to select colors for data visualization.
Will users be able to understand your color scheme? A legend next to the KeyLines chart may help users grasp what you’re trying to communicate.
KeyLines always starts the first segment at the 12 o’clock position. When viewing a single donut, it’s best to represent the largest amount of data in the first segment, then display the other segments from second largest to smallest clockwise around the node.
However, if you are using donuts to make comparisons between different nodes, it may be better to keep the colour order consistent. Which ever option you choose, make it consistent across your graph.
Showing a donut on every node in your chart might make it difficult to interpret. Instead, you could display an animated donut when you hover or select a node.
Donuts are designed to display proportional data only. If you want to communicate other types of data, use a different feature, such as tooltips. Similarly, donuts aren’t good at comparing absolute quantities between nodes. Consider using glyphs for this instead.
We hope that these tips are useful and that you can use the donuts feature to create some beautiful and informative KeyLines visualizations!