Assuming you bought AAPL stock at its closing price on January 2, 2008, how would your investment fare over the next four and a half years? (Quite well, for the most part…)

Rather than simply plot the absolute price on a linear scale, which would exaggerate gains and understate losses, instead compute the relative price, i.e., the current price divided by the purchase price. Then, use a log scale to accurately show proportional gains and losses: a +100% gain (2×) is as good as a -50% loss is bad (0.5×). As long as the current value never reaches absolute zero, meaning as long as the stock is not completely worthless, the scale domain never crosses zero.

To show percentage change (+20%, -20%), simply subtract 1 from the relative price:

var formatPercent = d3.format("+.0%");

// Formats a relative price (e.g., 2) as percentage change (e.g., +100%).
function formatChange(x) {
  return formatPercent(x - 1);
}

Although the log scale ticks are adequate in relative price space, a second linear scale can also be used to generate uniformly-spaced ticks.

A nice related technique is to add color to show positive or negative change.