index.js

void require('http://d3js.org/d3.v3.min.js');

// An introduction to d3js scales
//
// scales are transformations from an input
// domains to output ranges. you use them for
// transforming your input data into your output
// representation: $1B in the stock market might
// mean 200px on a laptop screen, and so on.

// Using scales! Here are the basics. Scales are
// both objects and functions.
myScale = d3.scale.linear();

// the scale is a function
myScale(2);
// that also has methods
myScale.domain([1, 2]);

// Like other bits of d3, these methods tend to
// be getter-setters that you can chain. If you set
// a domain or other property with a method, you can
// call the method with no arguments to get its value.
myScale.domain([4, 10]);
// retrieve that value
myScale.domain();

// OKAY, LET'S BEGIN

// Linear scales are the simplest kind: at most
// they divide or multiply their input by a
// coefficient. But not necessarily: here's
// an identity scale.
identityScale = d3.scale.linear()
	.domain([0, 1])
	.range([0, 1]);

// 0 goes in, 0 comes out.
identityScale(0);
// 1 goes in, 1 comes out.
identityScale(1);

// by default, linear scales don't clamp their input
// values: if you provide a value outside of the
// domain, it'll scale it just the same
identityScale(2);

// if you set the scale to clamp, it'll always
// output in the output range
identityScale.clamp(true)(2);

// Here's a more worthwhile linear scale: the
// output range is much smaller than the input domain
largeScale = d3.scale.linear()
	.domain([-10000, 100000])
	.range([0, 1]);

// This scales the output down significantly.
largeScale(10);

// Scales can also invert values: you give them an output
// and they give you the input necessary to get it.
pointOnScale = largeScale(1000);
// back to the input
largeScale.invert(pointOnScale);

// While the result of a linear scale is always just
// the input multiplied by some number, you might need
// a non-linear transformation. For this, you can use
// the sqrt scale.
sqrtScale = d3.scale.sqrt()
	.domain([0, 10])
	.range([0, 10]);

sqrtScale(5);

// but that's just shorthand: the pow scale can give
// you any exponent:
powScale = d3.scale.pow()
	.exponent(2)
	.domain([0, 5])
	.range([0, 10]);

powScale(0.5);

// Quantize scales map from input numbers that can be
// floating point to very specific output numbers:
quantScale = d3.scale.quantize()
	.domain([0, 10])
	.range([1, 2, 3]);

quantScale(0);
quantScale(2);
quantScale(3);
quantScale(5);

// Ordinal scales are extremely simple: they're
// just maps from input to output values.
d3.scale.ordinal()
	.domain(['hello', 'world'])
	.range(['hi', 'you'])('world');