Quantitative scales come in a few different flavors, but they all share a common characteristic, in that the input domain is continuous. Instead of a set of discrete values, a continuous scale can be modeled with a simple function. The seven types of quantitative scales are linear, identity, power, log, quantize, quantile, and threshold. They define different transformations of the input domain. The first four have a continuous output range, while the latter three map to a discrete range.

To see how they behave, we'll use all these scales to manipulate the Y coordinate when drawing the weierstrass function, the first discovered function that is continuous everywhere but differentiable nowhere. This means that, even though you can draw the function without lifting your pen, you can never define the angle you're drawing at (calculate a derivative).

Add the following to ScalesDemo:

(function quantitativeScales() {
  const weierstrass = (x) => {
    const a = 0.5;
    const b = (1 + 3 * Math.PI / 2) / a;
    return d3.sum(d3.range(100).map(
        n => Math.pow(a, n) * Math.cos(Math.pow(b, n) * Math.PI * x)));
  };
}());

We generate some data, get the extent of the weierstrass function, and use a linear scale for x:

const data = d3.range(-100, 100).map(d => d / 200);
const extent = d3.extent(data.map(weierstrass));
const colors = d3.scaleOrdinal(d3.schemeCategory10);
const x = d3.scaleLinear()
  .domain(d3.extent(data))
  .range([0, chart.width]);

A drawing function will help us avoid code repetition:

const drawSingle = line => chart.container.append('path') 
  .datum(data) 
  .attr('d', line) 
  .style('stroke-width', 2) 
  .style('fill', 'none');