D3 x-axis for each day of the week
<p>I have a JSON array like the following:</p>

<pre><code>[
  {
    "day": "Monday",
    "sales": 242
  },
  {
    "day": "Tuesday",
    "sales": 256
  },
  ...
]
</code></pre>

<p>This data covers one week, so there is an object for each day Monday through Sunday.</p>

<p>I have built a bar graph with D3 with a bar for each day of the week. I am now attempting to add an x-axis with a tick label for each day.</p>

<p><a href="https://i.stack.imgur.com/JFGt4.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/JFGt4.png" alt="enter image description here"></a></p>

<p>I've done the following to set up my y-axis:</p>

<pre><code>var yScale = d3.scaleLinear()
  .domain([0, d3.max(data, function(d) {
    return d.sales;
  })])
  .range([height, 0]);

var yAxis = d3.axisLeft(yScale)
  .ticks(5);

svg.append("g")
  .call(yAxis);
</code></pre>

<p>This works great, but for some reason, I am stumped on how to setup my x-axis with each day of the week under the corresponding bar. Note: I am using D3 version 4.</p>