D3 Bar Graph: X-axis

JavaScript
1

Tell us what’s happening:
I am working on making the bar graph in D3, and my x-axis is not displaying properly. (The y-axis looks fine.) I cannot get any tick marks to appear. Can anyone help me figure out why this is happening?

Thanks in advance.

Your code so far

var data = json.data
const w = 1000; //width
const h = 600; //height
const padding = 100 //padding
    
 //Scale for x-axis (years)
const xScale = d3.scaleLinear()
                 .domain([d3.min(data, d => d[0]), d3.max(data, d => d[0])]) 
                 .range([0, (w - (padding))]);

const xAxis = d3.axisBottom(xScale)

//SVG canvas
const svg=d3.select("a")
             .append("svg")
             .attr("width", w)
             .attr("height", h)
                
  
//bars
svg.selectAll("rect")
   .data(data)
   .enter()
   .append("rect")
   .attr("width", 3)
   .attr("height", (d, i) => {return d[1]/50})
   .attr("x", (d, i) => {return d[0], (i * 3) + padding})
   .attr("y", (d, i) => {return h - 2*padding+5 - d[1]/50})
   .attr("class", "bar")
   .append("title")
   .text(d => d[0] + " $" + d[1] + " Billion")

 //move the X-axis
svg.append("g")
   .attr("transform", "translate(" + (padding) + ", " + (h-(2*padding)+5) + ")")
   .call(xAxis)
   .attr("id", "x-axis");
3 
 const svg=d3.select("body")
.attr("x", (d, i) =>  (i * 3) + padding)

and the years data in format 2013-01-01 for that sa you have that must use ScaleTime instead ScaleLinear and format the data with format date
or just set domain to 1947,2016