title: Adding Label Text on Barchart D3js
body: <p>I'm trying to figure out the correct way to displays labels that will sit on top of each bar in my bar chart. I'd also like them to display a % after the number. </p>
  
  <p>Here is my Plunker: <a href="https://plnkr.co/edit/FbIquWxfLjcRTg7tiX4E?p=preview" rel="nofollow noreferrer">https://plnkr.co/edit/FbIquWxfLjcRTg7tiX4E?p=preview</a></p>
  
  <p>I experimented with using this code from the question found in the link below. However, I wasnt able to get it to work properly (meaning the whole chart failed to display)</p>
  
  <p><a href="https://stackoverflow.com/questions/18057917/adding-label-on-a-d3-bar-chart">Adding label on a D3 bar chart</a></p>
  
  <pre><code>var yTextPadding = 20;
  svg.selectAll(".bartext")
  .data(data)
  .enter()
  .append("text")
  .attr("class", "bartext")
  .attr("text-anchor", "top")
  .attr("fill", "white")
  .attr("x", function(d,i) {
      return x(i)+x.rangeBand()/2;
  })
  .attr("y", function(d,i) {
      return height-y(d)+yTextPadding;
  })
  .text(function(d){
       return d;
  });
  </code></pre>