title: Adding custom backgrounds to D3.js bar graph
body: <p>I'm fairly new to d3.js and I'm building a bar graph in D3.js.</p>
  
  <p>I'm trying to make the background three different colors to break the x axis into distinct three zones (low, medium, and high). I figure I should be appending some <code>&lt;g&gt;</code>elements but I'm not sure how to place them in this case.</p>
  
  <p>The site is up <a href="http://www.hungergames.miketissenbaum.com/patchGraph.html" rel="nofollow noreferrer">here</a>:</p>
  
  <p><img src="https://i.stack.imgur.com/nM9Rs.gif" alt="enter image description here"></p>
  
  <p>Not sure if providing more of the code would help</p>