The Effect of Chart Height and Color Saturation and Lightness to Graph Comprehension

Color is an important property of visualizations especially in the comprehension of complex line charts while chart size measured as distance between data points, is significant when dealing with numerous data points that are used for comparison. Multiple time-series line (MTSL) graphs are a common tool in visual representation of data but only a few studies explored the effect of visual properties on its comprehension. This study evaluated the effect of color properties (saturation and lightness), and vertical distance (chart height) in the comprehension of multiple time-series line graphs. It was posited that color palettes with higher saturation levels and charts with higher vertical distance improve comprehension. Comprehension was measured in terms of accuracy and response time using a discrimination task that required participants to find which time series possessed the highest value at a point. Six sets of multi-hued palettes with varying lightness and saturation were developed using colors equidistant in the color wheel. Two levels of chart heights were used to evaluate vertical distance. A total of ninety-two (92) subjects took part in the experiment. Results showed that when color saturation alone was considered, the highest saturation level was established to have the best user performance. Nevertheless, when the interaction of saturation with lightness was factored in the study, findings show that when colors with high level of lightness are used, they should have lower saturation levels and vice versa. This implies that there should be a balance between lightness and saturation when using colors in data visualizations. Vertical distance did not have a significant effect on comprehension, but a larger size generally resulted in better performance.