This article describes the idea of having a strip of color
codes to represent a line graph.
Problem Statement:
In a web page, the space is always a constraint. To have a
graph in the web page would require some amount of space to make the graph look
meaningful. If the size if reduced, then the graph will not make any sense. In
the figure below, the space taken by the graph is much larger than any of the
areas.
Solution:
The solution addresses the problem by having a simple color
coded strip which will give all the information in the graph. The figure below
shows a sample strip as to how it looks.
This strip will give a picture of the graph as to what is the highest point and the least point and the box at the end will also provide you the average or the SLA line in the graph. Its takes much lesser space and is easy to understand. Along with the strip, there is a scale which will be shown to determine the value in the strip above. From the strip below, once can easily understand as to what are the high/low and medium trends in the graph.
Now that we have the way to
represent data, how is that we can transform the existing lie graph to the
strip?
Consider a typical line graph, this will be something like
shown below
To convert the above graph and create a new graph, a
coloring scheme should be applied, for this example, we are using 2 colors and
the scale will look like as shown below.
After applying the color scheme scale to the graph, the graph would look like this
The above graph can be converted into a color strip by
picking each box of the data point. The outcome of the the above graph as a
color strip is shown below
No comments:
Post a Comment