title: tickValues in d3 not working as expected
body: <p>I am trying to make a simple graph where I only have one tick value, at the max of the y axis. I actually had this working, but I moved things around because I needed to have things contained within a function and even though I did not change this code it is not working as expected. </p>
  
  <p>I've been staring at it for over an hour and would appreciate a second set of eyes. </p>
  
  <p>First, some code: </p>
  
  <pre><code>function AlmViz() {
      ... 
  
      this.x = d3.time.scale();
      this.x.range([0, this.width]);
  
      this.y = d3.scale.linear();
      this.y.range([this.height, 0]);
  }
  
  function loadData(viz) {
      ... 
  
      viz.yAxis = d3.svg.axis()
          .orient("left")
          .tickSize(0)
          .tickValues([d3.max(viz.y.domain())])   // only one tick at max
          .tickFormat(d3.format(",d"));
  
  
      viz.y.domain([0, d3.max(level_data, function(d) { return d[category.name]; })]);
  
      ...
      viz.svg.append("g")
          .attr("class", "y axis")
          .call(viz.yAxis);
  }
  
  var viz = new AlmViz();
  loadData(viz);
  </code></pre>
  
  <p>However, the y-axis is wonky. The tick has the right text, but it gets placed in the wrong location. </p>
  
  <pre><code>&lt;g class="y axis"&gt;
       &lt;g class="tick major" style="opacity: 1;" transform="translate(0,7016)"&gt;
           &lt;line x2="0" y2="0"&gt;&lt;/line&gt;
           &lt;text x="-3" y="0" dy=".32em" style="text-anchor: end;"&gt;7,016&lt;/text&gt;
       &lt;/g&gt;
       &lt;path class="domain" d="M0,0H0V1H0"&gt;&lt;/path&gt;
  &lt;/g&gt;
  </code></pre>
  
  <p>The problem is <strong>transform="translate(0,7016)</strong>. Does anybody know how to fix it? </p>
  
  <p>I should note, I have virtually the same code in an earlier iteration, and it was working correctly. See <a href="https://github.com/jalperin/almviz/blob/d3/alm.js" rel="nofollow">https://github.com/jalperin/almviz/blob/d3/alm.js</a> for details. </p>