Tell me more ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.
up vote 1 down vote favorite

I'm trying to find the best way to represent different states on a graph. This graph is trending information, it can have several trends at once. Numeric data is fine as I'm using line graphs. But I don't know the best way to represent different states (like "ON", "OFF", "IDLE" for example).

I was wondering if anyone ran across this or has an idea. I want it to look appealing of course and wasn't sure if bar graphs would be the best choice.

btw, the states can be more than 3, they are user defined and can between 2 and 6.

share|improve this question
Is this referring to the state of a particular piece of data or the graph as a whole? – JeffH Aug 16 '12 at 23:45
no to a piece of data, plotted over time. For example at 1pm its "ON" on 3pm its "OFF". Data is captured at the same frequency as numerical data. – mgalal Aug 17 '12 at 2:27
Are the different states on a linear scale (eg levels of 'on-ness', as per your off -> idle -> on example), or could they be heterogeneous (eg not on a scale at all)? – Jimmy Breck-McKye Aug 17 '12 at 15:55
That would just depend on how to represent the states, I don't have a preference of whether its mapped to the line chart scale or if its on its own scale (y-axis). X-axis is time and that is the same for all. – mgalal Aug 17 '12 at 18:42

1 Answer

up vote 2 down vote accepted

The simplest way to combine data is to make colour coding of every piece of data (or code every value with it's own shape -- that is better for color-blind users -- for instance, filled circle for on, empty circle for off, square for idle etc.). If the amount of user defined states is between 2 to 6 it will work rather good (naturally, the legend and the popup hint with state description is necessary).

Bars are not very good cause it make the picture fuzzy, so it's better to use something like this (for color coded values):

enter image description here

If you want to display more than one graph at one picture, it is better to use shapes for states, and colour of the shape for every element. I'm not sure in your case, but interconnections between shapes by lines may be unnecessary. You may also provide an easy way to concetrate on only one chart -- for example, the user can hover over one trend line by mouse and other trends become dimmed by contrast.

share|improve this answer
Thanks for that! I didn't think of using shapes to represent data. – mgalal Aug 19 '12 at 20:52

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.