Add x,y axis in d3 v4

Question

I'm really struggling to add x and y axis to my bar chart. I find always different ways to add them and till now I haven't been able to make those ways work on my code.

 var maxVal = d3.max(d3.values(dataArray));                     

 var scale = d3.scaleLinear()                                   
     .domain([0, maxVal])                                       
     .range([0, 400]);                                          

var xAxis = d3.axisBottom()                                    
     .scale(scale);                                             

 d3.select("#accordionChart")                                   
      .selectAll("div")                                         
      .data(dataArray)                                          
        .enter()                                                
        .append("div")                                          
        .style("width", function(d) { return scale(d) + 'px' }) 
        .text(function(d) { return d; })     

What am I missing?

Answer 1

I suspect that you're missing calls, something like:

// draws the x and y axes
svg.select('.xaxis')
  .call(xAxis);
svg.select('.yaxis')
  .call(yAxis);

Additionally, I didn't see code in your snippet for placing either axis, something like:

// append skeleton of axes to svg
svg.append('g')
  .attr('class', 'xaxis')
  .attr('transform', 'translate(0,' + height + ')');

svg.append('g')
  .attr('class', 'yaxis');