What is the difference between d3.scale.quantize() and d3.scale.quantile()?

Question

From the docs, the definitions are:

quantize

..a variant of linear scales with a discrete rather than continuous range. The input domain is sti

Answer 1

Coloring Maps has a great visual explanation.

Quantize:

Quantile:

On the scatter plot, the previously horizontal bars are now vertical as the colors of each place is determined by its rank, not value.

Here's a code snippet in D3 v4 that shows different results in quantize and quantile.

const purples = [
  'purple1',
  'purple2',
  'purple3',
  'purple4',
  'purple5'
]
const dataset = [1, 1, 1, 1, 2, 3, 4, 5] // try [1, 2, 3, 4, 5] as well
const quantize = d3.scaleQuantize()
  .domain(d3.extent(dataset)) // pass the min and max of the dataset
  .range(purples)
const quantile = d3.scaleQuantile()
  .domain(dataset) // pass the entire dataset
  .range(purples)
console.log(quantize(3)) // purples[3]
console.log(quantile(3)) // purples[4]