We create our scales, but first, we learn how to split our data into equally-sized bins.
Our x scale should look familiar to the ones we've made in the past. We need a scale that will convert humidity levels into pixels-to-the-right. Since both the domain and the range are continuous numbers, we'll use our friend
Let's also use
.nice(), which we learned in Module 2, to make sure our axis starts and ends on round numbers.
Rad. Now we need to create our
But wait a minute! We can't make a y scale without knowing the range of frequencies we need to cover. Let's create our data bins first.
How can we split our data into bins, and what size should those bins be? We could do this manually by looking at the domain and organizing our days into groups, but that sounds tedious.
Thankfully, we can use d3-array's
d3.bin() method to create a bin generator. This generator will convert our dataset into an array of bins - we can even choose how many bins we want!
Let's create a new generator:
Similar to making a scale, we'll pass a domain to the generator to tell it the range of numbers we want to cover.
Next, we'll need to tell our generator how to get the the humidity value, since our dataset contains objects instead of values. We can do this by passing our
metricAccessor() function to the
We can also tell our generator that we want it to aim for a specific number of bins. When we create our bins, we won't necessarily get this exact amount, but it should be close.