OmniGraphSketcher Goes Logarithmic

by Robin on August 29, 2011

“Wow, your customers are nerdy!”

That was a friend’s response recently when I mentioned that logarithmic axes are the number-one feature request for OmniGraphSketcher.

The way I see it, our customers understand that logarithmic scales are the best way to present many types of data and ideas. Stock prices, advances in technology, and many other phenomena tend to change by multiples rather than additions. Logarithmic scales show each doubling as a constant distance, so you can compare percent changes without large differences in absolute size getting in the way.

So I’m very excited to announce that OmniGraphSketcher 1.2 for Mac and OmniGraphSketcher 1.5 for iPad are now available, with full support for logarithmic axes!

Logarithmic axes example

You don’t even need to know anything about logarithms to use this feature. You just turn it on via the axis inspector, for either or both axes. (The resulting charts are sometimes called lin-log and log-log.) There is no step two!

These logarithmic axes are designed to follow best practices in information visualization, and they work seamlessly with all the other features of the app, such as dragging, nudging, snapping, sketch recognition, axis manipulation, and scale-to-fit. And because logarithmic scales are more likely to span many orders of magnitude, we now support much larger and smaller numbers (up to 10300 and down to 10-300), more decimal precision (up to 13 digits), and scientific notation (so you can use numbers like 3 x 10200 without typing 200 zeroes).

Given that the known sizes of physics only range from about 10-35 meters (the Planck distance in quantum theory) up to 1026 meters (the size of the observable universe), we figure that +/- 300 orders of magnitude should be plenty.

At least for now.

As part of these updates, we’ve also refined the algorithms that draw axis tick marks and tick labels. When there is not enough room to label every tick mark, we now consistently label every other tick mark, or every 5th, or every 10th, etc. If we skip a lot, we’ll automatically use major/minor tick marks to make it easier to see which tick marks are getting labeled.

Automatic major/minor tick marks

On logarithmic axes, we show just the first five numbers between each power of ten when possible, then only the powers of ten themselves, and then evenly-spaced powers of ten. OmniGraphSketcher makes all of these decisions for you, so you never have to think about it.

Tick labels from 1 to 50 Tick labels from 1 to 1000 Tick labels from 1 to 10^25

And did I mention that your axis ranges don’t have to end on powers of ten? Suppose your data values fall between 8 and 200. In many charting programs, the best you can do is this:

Axis range limited to powers of ten

But we think logarithmic axes should be just as flexible as linear ones, and we want you to be able to switch between linear and logarithmic scales seamlessly. Again, we’ve done the work so you can get what you’d expect:

Fully customizable logarithmic axis range

Last but not least, we’ve added a really nifty new feature called line interpolation. As you know, OmniGraphSketcher lets you draw lines freehand even if you don’t have exact data to back them up. This is great if you have a rough idea of a trend or want to visualize several possible scenarios. But wouldn’t it be cool if you could also turn your sketched lines into sampled data points for analysis or re-plotting in another program? That’s exactly what line interpolation does. It samples at each horizontal tick mark (x-value) to convert your line into a data series.

The reason we’re introducing this at the same time as logarithmic axes is because it lets you see how the shape of a line differs in linear vs. logarithmic space. Regular lines in OmniGraphSketcher simply connect two or more data points as smoothly as possible, so intermediate values do not necessarily stay the same when you convert between linear and logarithmic scales. Line interpolation solves this by letting you anchor some of the intermediate points. Now you can easily demonstrate, for example, how a straight line in logarithmic space becomes an exponential curve in linear space:

A straight line in logarithmic space becomes an exponential curve in linear space.

Download the latest versions of OmniGraphSketcher from the App Store (Mac, iPad) or from our online store (Mac); or use the built-in software update to download automatically.

And let us know what you think!

(If you want all the details, check out the release notes for the Mac and iPad versions.)

A Nudge Forward

by Robin on June 23, 2011

Typically before we ship a new version of OmniGraphSketcher, I like to try using the app to re-create a real economics diagram based on a set of the most interesting graphs in an economics textbook. In other words, I try to simulate the experience of being an actual OmniGraphSketcher user.

The last time I did this, I was blown away by how easy it was to draw this professional-quality graph, right there on my iPad — just by tapping and dragging my fingers.

 

I mean, look at that! I could easily email it in PDF format directly to a textbook publisher.

There was one frustration, though. It was difficult and somewhat error-prone to precisely position text labels, especially when they were short, abbreviated variable names. The labels were mostly hidden under my finger, so adjusting them just right required zooming in as far as I could and even then having to guess if I was in exactly the right spot.

I knew that Apple's iWork applications had solved this problem with a “nudge” gesture, which you perform by holding one finger on the object to be adjusted and then swiping a second finger in the direction you want to nudge. The object being held shifts by one pixel per swipe. That feature was already on our very long to-do list, but no customers had ever requested it, so it was not in any immediate plans. Yet assembling this example graph made it clear that finely adjusting objects was the weakest link in our quest to make graph creation as quick and easy as possible.

I set about implementing the nudge gesture, which quickly turned into a major overhaul of our whole gesture recognition system. That overhaul made the other gestures more reliable, and it paved the way for new and interesting gesture shortcuts. For example, OmniGraffle for iPad now includes the ability to quickly send objects forward and backwards by pressing one finger on the selection while swiping two more fingers up (to send forward) or down (to send backward).

Now that OmniGraphSketcher for iPad includes the nudge gesture, creating that complex economics graph is really a breeze. You'd think I'd have gotten used to it by now, given that I've been developing the app ever since the iPad was announced and I know in detail how it all works. Yet Apple's term “magical” is still the best way I know of to describe what it feels like to use the app to make beautiful, accurate graphs.

 

Dueling Y-Axes

by Robin on January 25, 2010

One of the most common requests we get for OmniGraphSketcher is to support multiple y-scales overlaid on the same graph, to make it possible to plot several different types of related data on the same chart. Some people call this approach “dual y-axes” because graphs of this type tend to put vertical axes on both sides of the graph area. For a while now we've been debating whether or not this is a good idea.

We've now posted an article with our thoughts on the matter.

Our main conclusion was that overlaying data with disparate scales saves space, but it makes the data significantly harder to interpret. The dual axes “duel” for your attention. So instead of overlaying scales, we recommend using a set of multiple graphs, aligned along their common axis. Graph Sketcher does not have a built-in option for this, but you can easily Copy As Image with each graph and paste into OmniGraffle or another program with layout capabilities.

Graphs for running pace and distance were copied from OmniGraphSketcher and pasted into OmniGraffle.

Read the article for more details, and if you have a graph with overlaid scales that you think is more effective than its separated-and-aligned counterpart, please let us know – we still have an open mind about it.

OmniGraphSketcher: The Vision

by Robin on November 2, 2009

If you read our tagline, you might think that OmniGraphSketcher is all about “fast, simple graph drawing and data plotting.”

Which is true.

But why did we make such a program? (Or if you like puns, what's the “point”?) Why does it keep us up at night, and how do we decide which features should be improved first? In short, I want to tell you about our vision.

The first part of the vision has to do with quantitative ideas. Quantitative means that scale is relevant. It means it's valid to say that one thing is twice as big, far, tall, fast, costly, or experienced as another. Quantitative ideas are central to scientific disciplines and an important part of most business and policy issues. Thinking quantitatively allows us to understand and predict how different parts of the world relate to each other in a precise manner.  How will higher taxes affect the local economy? How will this ratio of chemicals change the battery's charging time? How does this bridge react to increasingly larger loads?

I emphasize ideas because quantitative knowledge is not limited to what traditional software tools have focused on: numerical data and equations. Sometimes knowledge is less specific. For example, you might just have a rough idea of how different price points affect the number of sales. Or you might know how a new material behaves at room temperature but have only an intuition about what happens above 100 degrees. These quantitative ideas could be a precursor to a more precise theory, or they could be as precise as they need to be, given the messiness of the real world.

The second part of the vision is communicating those ideas visually. That's because often, the best way to explain a quantitative idea is through a picture. This is true whether you have data, equations, or imprecise quantitative notions. Would you rather have a table with 240 numbers, or a visual plot of that data?

data-plot

Is it more meaningful to specify f(x) = sine(x), or to see that function in the x-y plane?

sinefunction.png

And finally, is it more informative to talk generally about the relationship between quantity and price of a product, or to see an illustration of how the price affects the quantity demanded?

iphone-econ.png

Of course, words, equations, and tables of numbers are useful too. But particularly when you're trying to communicate ideas to someone else, there's a good chance that a visual will make it easier to understand.

Communication does not just mean throwing information at someone; it means transferring real understanding in a reasonably short amount of time. For this to happen, the receiver needs to get the information on a logistical level – say, a piece of paper or an emailed PDF. Then they need to get it on a perceptual level – for example, notice that one data point is above another or that two data series intersect in a certain place. And finally, they need to translate those visual inputs into something meaningful – say, that the market share of one product is overtaking another.

For successful communication to happen, all three of these levels must be met. To facilitate the logistics, we try to provide easy ways to export and share your graphs. To improve accuracy in perception, we use our knowledge of the human visual system to define and encourage best practices for information layout. And to help make the visuals meaningful, we made it easy for you to annotate your diagrams in a variety of ways.

In summary, the vision of OmniGraphSketcher is to make it as easy as possible to visually communicate your quantitative ideas.

Hopefully, this gives you some hints about how we might expand the functionality of OGS in the future (though we can't make any guarantees). For example, logarithmic scales and date/time scales are high on our priority list since many quantitative ideas are best expressed in those contexts. We'd also love to improve your ability to annotate graphs by allowing equations or other pictures to be dragged onto the canvas. (For now, you can only do this by exporting your graph to another program.)

This should also provide hints about where we're not headed. For example, although pie charts are considered standard in some applications, they use a large amount of space, display a small amount of data, and are not well suited to the human visual system. In other words, we don't think they have any visual communication advantages over bar charts, which we already include (more on this in a future post). Another “standard” feature that we omit on purpose is the legend-in-a-box. It's much easier to read a graph that puts each label right next to the data it refers to, and we designed OGS to make this easy.

As always, we look forward to your feedback. We're most interested in the motivations behind requests – for example, “labeling lines” rather than “rotating text”.  And when possible, attach an example graph or diagram – since we so love visual communication.

It Turns Out You Can Make Error Bars With OmniGraphSketcher

by Robin on July 24, 2009


Update: As of version 1.1, the new “Make Error Bars” command takes care of all steps after importing your data into OmniGraphSketcher.


The advantage of having such a general-purpose graphing program is that the possibilities are almost endless.  So endless, in fact, that it took us until just now to realize that making vertical error bars (a popular feature request) is actually pretty easy.

As an example, suppose you ran an experiment that involved taking many imperfect measurements each year, over 12 years.  One nice way of visualizing the results is to calculate a confidence interval statistic for each year of samples and display those intervals as “error bars”:

It turns out there is already a reasonably easy way to make plots like this in OmniGraphSketcher (and we hope to make it much easier in the future).  First, as with any data analysis work, you will probably want to start the process using a spreadsheet or statistics program to do the necessary calculations and data organization.  You will want to end up with four columns: (1) the x-value for each data bin (in our example, the year); (2) the median data value for each bin; (3) the upper end of each confidence interval (the tops of the error bars); and (4) the lower end (bottoms).  Here is an example of my data in Numbers (Apple's spreadsheet program):

The x-values must be in the first column, but the other three columns can be in any order.

Here are the values as selectable text, if you want to follow along with this example yourself:

year, median, upper .05, lower .05

1940, 52.4, 59.8, 43.2

1941, 62.6, 66.2, 49.6

1942, 54.9, 66.5, 51.6

1943, 79.1, 88.9, 68.8

1944, 97.6, 104.6, 90.6

1945, 117.5, 123.2, 110.1

1946, 121.7, 126.5, 107.5

1947, 110.3, 114.7, 99.1

1948, 98.2, 106, 86.4

1949, 93.1, 101.2, 78.5

1950, 94, 103.5, 86.2

1951, 79.7, 90.6, 66.3

Select that whole block of data, copy it, and paste it into OmniGraphSketcher.  In most cases, you should probably follow that up by setting the axis ranges with View –> Scale To Fit Data.  You will end up with something like this:

Your three data columns have become data series plots that share the x-values from the initial column.

Now, the first magic step is to turn the “tops” and “bottoms” into the tick-mark data point type.  This data point style is cool because it automatically becomes perpendicular to any attached line.  It's easy to select the top and bottom point series by clicking on a point from the top series, holding the shift key, and then clicking a point from the bottom series.  (Both clicks will select the whole series because imported data are “grouped” by default.)  Once those are selected, just choose the tick point style in the Style inspector:

Your graph should now look a bit weird, like this:

Those tick mark points are at a default jaunty angle because they don't yet have lines attached.  In the second magic step, you provide those lines.  This is a little repetitive in OmniGraphSketcher 1.0, but not too bad unless you have dozens of data points.  Start by dragging the selection box across the first vertical set of three points that will form an error bar group.  When those are selected, hit command-shift-K (which corresponds to Edit –> Line –> Straight).  Ta-da, you have your first error bar!  Now you will have to go through each vertical set, selecting the points and hitting command-shift-K.  When you're done, you should have something like this:

How lovely!  You can still easily select all of the “tops” or “bottoms” and change their color or size.  There is one last trick to help you change the color or size of all of the “bars” themselves.  Choose Edit –> Select All –> Lines.  Then click on “Group” in the toolbar.  Now your bars are a grouped set just like the top ticks and bottom ticks, so whenever you click on one bar, all of the other bars will also be selected.  Now that you can select everything so easily, it is a snap to edit visual styles to make the error bars more subdued, if you'd like.  Here they are with a dark gray color and thickness of 1.0 (and a few axis touch-ups):

Beautiful!

In a future version of OmniGraphSketcher, we plan to include the capability to automatically find those vertical groups and do all of the repetitive steps for you.