Encountering Uncaught Type Error in D3

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.

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!

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

It worked! Thanks! :relaxed: