Using Ordinal Scales
We will write an ordinal scale to help us scale age groups into colors.
We'll cover the following...
We are going to jump straight into it. Under the scales section, we are going to define a variable called colorScale. Its value will be the d3.scaleOrdinal() function.
const colorScale = d3.scaleOrdinal().domain(dataset.map(element => element.name)).range()
For the domain, unlike other scales, we can not provide a range of values. Instead, we need to provide a full list of values that should be transformed. In our case, we are going to provide a list of age groups. We are not going to pass in the entire data array. We will generate a new array with the age groups.
We can generate a new array based on a previous array by calling the map() function. Inside the domain() function, we are calling the dataset.map() function.
The map() function will loop through the array it is called on. After looping through the array, it will return a new array. Inside this function, we have a callback for each iteration of the loop.
The element argument will reference each object in the array. The array we are creating will be filled ...