Axis won't show up on D3 Bar Chart

JavaScript
1

Tell us what’s happening:

I am trying to get the Y axis to show up (will add X axis later) but nothing is happening when I add the code. I’m trying to append a ‘g’ to the container with the graph in it (svgContainer) but I’m beginning to think I’m doing it wrong.

Your code so far
https://codepen.io/seth-alan-burleson/pen/XWjjrGP?editors=0011

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/86.0.4240.198 Safari/537.36.

Challenge: Visualize Data with a Bar Chart

Link to the challenge:

2

Update: I’ve now got the X axis to show up, while I was waiting for a response, but strangely I did this the same way I did the Y axis, but it isn’t working. Other problem is I can get the X axis to move side to side with transform, but I can’t seem to place it at the bottom.

3

Ok Welcome to my Blog I guess now. I figured out the X axis was because my SVG container object wasn’t big enough to have anything except the bars in it. I used a height constant for the container and then used the same to scale the height of the bar. I’ve now gone back and added 100 to the height, then I was able to move the axis to the bottom without moving it outside the SVG container. Trying that for the Y axis now.

4

Ok, so nothing is working with the Y axis, in fact, when I try to add it in the same way I did the X axis, it makes my graph disappear.

5

Hope this helps someone in the future. You’ve got to leave extra space around the graph so that you can see the axis’es.