Rotating circle, loose ends, on-line dashboards and charts
May 07, 2013
There is a tendency when producing dashboards to go for the cutesy-cutesy. Reader Daniel L. came across an attempt by Facebook to document its data center metrics (link). They chose this circular, spiraling design:
Notice that the lines of equal distance on a circular plot are the concentric circles. Thus, when they connect different points in a continuous way, as if it were a standard line chart, the line segments between data points are distorted. The diagram below shows the problem:
One potential advantage (although not worthwhile) of wrapping the data into a circle is that the 24 hours become a continuous line. Except that it isn't the case here! Weirdly, the purple and blue lines show a huge discontinuity at the ray that points vertically upwards from the origin. This leads to an even more fascinating find.
The circle actually rotates! It's like a rotating restaurant. The time shown vertically pointing upwards keeps changing as I write this post. This makes the discontinuity even more baffling. You'd think the previous data point just shifts anti-clockwise but apparently not. If any of you can figure this out, please leave a comment.
As Daniel pointed out, the traditional line charts shown in the bottom half of the page would have done the job with less fuss. Not as eye-catching, but not as baffling either.
One innovation of on-line charts is the replacement of axis labels with mouse-over effects. Mousing over the chart here produces the underlying data values. This is elegance.
One horrible trend with on-line charts is the horrendous choice of scale. Look at the top two charts, especially the orange line chart about power usage. It makes no sense to choose a scale that completely annihilates the underlying fluctuations.
I have found the same problems with many Google charts. It looks as if nothing is happening except when you look more closely, you learn that a tiny distance represents a big percentage shift in the underlying data.
I don't follow the point about the discontinuity at the vertical ray. 24 hours should not necessarily form a continuous line; after all, the two end points are 24 hours apart.
I agree that the circular chart is problematic. Notice the dynamic x-axis labels are physically separate from the chart itself, so it's hard to keep your eyes on both at once. Beyond that, it's simply awkward to mouse over in a circular motion.
It looks like the display is actually modeled on those old style rotary chart loggers (http://za.rs-online.com/web/c/test-measurement/data-acquisition-logging/chart-recorder-accessories/). It is eyecatching. Too bad it doesn't seem to work.
Posted by: Adam | May 07, 2013 at 11:10 AM
Rotating circles make much sense in a dynamic visualization, which is updated in a sweep, and for periodic phenomena where the ends necessarily meet. For static visualizations of aperiodic phenomena, as considered here, it might be distracting.
Posted by: emre | May 07, 2013 at 12:44 PM
A line graph would certainly make for easier trend-spotting, but having the circle rotate just means the graph always shows the last 24 hours, with the recent data at the top. If this were a dashboard that someone used to monitor these metrics throughout the day, this would make sense because it provides a consistent place to look for the most recent data.
The discontinuity at the top is just what the previous commenters have said: today's 6:00 data meeting up against yesterday's 6:01 data. However, the fact that the older data actually changes on refresh, rather than simply rotating out of the way, makes no sense at all. I'm betting that's a bug.
Posted by: Jeff | May 08, 2013 at 07:35 AM
@jeff - I couldn't disagree more about the usefulness of the chart rotating.
The reasons for using a straight line chart over a circular chart are vast and varied (and, hopefully, obvious).
But assuming we are going to use a circle, it should never rotate.
The entire benefit to the circle for a 24 hour data display is that it mimics a clock. The data for 4:00 should always be at 4:00...no other alignment makes sense.
If the latest data points are not immediately obvious no matter where on the circle they are, then we have bigger problems with our chart than even the circle itself.
Posted by: jlbriggs | May 08, 2013 at 11:25 AM
Hi, jlbriggs. I think we're more or less on the same page. Yes, I can't imagine a situation where I would choose a circular chart for something like this to begin with.
My point was just this: if you were creating a display (of whatever shape) that was going to be on someone's desk all the time, and part of their job was to make sure that the things being measured never strayed beyond some defined tolerance, there would be an argument for using the current moment as the fixed point of reference, the better to enable reading at a glance. In that case knowing what was going on at 4:00 is maybe less important than knowing what has happened in the few minutes since you last glanced in its direction. I realize that Facebook's thing is not such a display, but I could see a use for it.
Once of you step out of my hypothetical real-time context, data plotted on a timeline with start and end points that you don't have to think about will likely be much easier to interpret if you're looking at general trends.
Posted by: Jeff | May 08, 2013 at 02:43 PM
Adam, circular charts can be defended where the data are truly circular (for instance, the daily average, over a period of time much larger than a day). What the discontinuity shows us is that, as you say, the last data point twenty four hours ago need not be related to the first data point now.
But that means the data are not periodic! It's a linear time presentation, not a circular one. So there's no reason to curl the graph up in a circle, it should have been a rectangle.
This was Florence Nightingale's mistake too; she represented as a circle that which was a progression, and when she got to the end of a year, she made a second circle :-(
Posted by: derek | May 13, 2013 at 05:05 AM