D3 difference between ordinal and linear scales

As for Ordinal Scales:

Ordinal scales have a discrete domain, such as a set of names or categories.

An ordinal scale’s values must be coercible to a string, and the stringified version of the domain value uniquely identifies the corresponding range value.

So, as an example, a domain of an ordinal scale may contain names, like so:

var ordinalScale = d3.scale.ordinal()
        .domain(['Alice', 'Bob'])
        .range([0, 100]);

ordinalScale('Alice'); // 0
ordinalScale('Bob'); // 100

Notice how all values are strings. They cannot be interpolated. What is between ‘Alice’ and ‘Bob’? I don’t know. Neither does D3.

Now, as for Quantitative Scales (e.g. Linear Scales):

Quantitative scales have a continuous domain, such as the set of real numbers, or dates.

As an example, you can construct the following scale:

var linearScale = d3.scale.linear()
        .domain([0, 10])
        .range([0, 100]);

linearScale(0); // 0
linearScale(5); // 50
linearScale(10); // 100

Notice how D3 is able to interpolate 5 even if we haven’t specified it explicitly in the domain.

Take a look at this jsfiddle to see the above code in action.

Leave a Comment

error code: 521