Creating the color scale to map labels to colors

Now, we want to map the label properties of our dataset to colors, instead of random numbers, like in the previous section. We can come up with our own color scheme, or we choose one of D3's sets of colors from https://github.com/d3/d3-scale-chromatic#categorical.

If we want to, we can see that these color schemes are just arrays. Temporarily, add the following to the bottom of app.js:

console.log(d3.schemeCategory10)

The following content will be displayed:

Consequently, we can use a color scheme when setting a range. Replace the previous console.log() statement with the following:

var colorScale = d3.scaleOrdinal();
colorScale.range(d3.schemeCategory10);

We can generate an array of labels for the domain by using JavaScript's native map function. Add the following to the bottom of app.js:

colorScale.domain(dataset...