Band Scales
The band scale was introduced for helping us space out bars across an x-axis.
We'll cover the following...
We are going to learn a new scale called a band scale. We will talk about it in a moment, but first, let’s create a scale for the y-axis. The y-axis will measure the population. We are going to use a linear scale for the y-axis.
Before getting started, remove the console statement for the stackData variable if you are working locally. We don’t need it anymore.
Linear scale
We will create a variable called yScale. Its value will be the d3.scaleLinear() function.
const yScale = d3.scaleLinear().domain([0, d3.max(stackData, ag => d3.max(ag, s => s[1]))]).rangeRound([dimensions.ctrHeight, dimensions.margins])
For the domain, the lower end of the range will be 0. As for the higher end of the domain, we need to grab the largest population from our dataset. This will be a bit challenging because the population for each state is divided into age groups. We will need to check each age group. Then, we will need to compare the population sizes. We’re using the d3.max() function to help us. We are passing in the ...