Encountering Uncaught Type Error in D3

1

I am working on the “Visualize Data with a Bar Chart” challenge. And I am trying to add axises to my graph. Here is the link in my code pen:
Visualize Data in Code Pen.
And I have encounter an uncaught type error:

Above is the error message I am getting.

Here is the relevant code snippet in case you don’t want to read the whole thing.

// create a year array
var yearArray = [];
// push the data into the year array
data.forEach(function(innerArray){
 var year = innerArray[0].split("-")[0];
 yearArray.push(year);
});

var x_domain = d3.extent(yearArray);
console.log(x_domain)

chart.append("g")
    .attr("transform", "translate(0," + height + ")")
    .call(d3.axisBottom(x_domain));

Height variable is defined at the beginning of my JavaScript.

And I have tried search on StackOverFlow, there is a person who encounter the exact same problem as mine, but there is not satisfying answer to that question.

Any help will be highly appreciated.

2

Haiiiyo.

If I’m not mistaken it’s because you’re not passing a D3 scale to d3.axisBottom() (you’re simply passing an array. :slight_smile:

Have a quick read through this and come back if you run into any issues—it should be relatively straightforward.

I hope that helps!

3

Thanks, I will take a look at this and update you when I solve the problem.:grinning:

4

It worked! Thanks! :relaxed: