title: display dates on y-axis: first entry missing?
body: <p>I'm trying to display a horizontal bar plot with iso dates (Y-M-D) on the y axis.</p>
  
  <p>Here is what I've come up with so far:</p>
  
  <p><a href="http://jsfiddle.net/draptik/0zLyysza/" rel="nofollow noreferrer">http://jsfiddle.net/draptik/0zLyysza/</a></p>
  
  <p>Stripped down version:</p>
  
  <pre><code>var data = [
    {date: new Date('2014-11-01'), kg: 1},
    {date: new Date('2014-11-02'), kg: 2},
    {date: new Date('2014-11-03'), kg: 3}
  ];
  
  var width = 600,
      barHeight = 20,
      margin = { bottom: 50, left: 100 };
  
  var x = d3.scale.linear()
        .domain([0, d3.max(data, function (d) { return d.kg; })])
        .range([0, width]);
  
  var y = d3.time.scale()
        .domain([data[data.length - 1].date, data[0].date])
        .range([barHeight * data.length, 0]);
  
  var svgContainer = d3.select('#chartContainer').append('svg')
        .attr('width', width + margin.left)
        .attr('height', barHeight * data.length + margin.bottom)
        .style('border', '1px dashed red');
  
  var barGroup = svgContainer.selectAll('g')
        .data(data)
        .enter()
        .append('g')
        .attr('transform', function(d, i) { return 'translate(' + margin.left + ',' + (i * barHeight) + ')'; });
  
  barGroup.append('rect')
    .attr('width', function(d) { return x(d.kg); })
    .attr('height', barHeight - 1)
    .attr('fill', 'gray');
  
  // x axis ====================================================
  var xAxis = d3.svg.axis().scale(x);
  
  svgContainer.append('g')
    .attr('transform' , 'translate(' + margin.left + ',' + (barHeight * data.length) + ')')
    .call(xAxis);
  
  // y axis ====================================================
  var yAxis = d3.svg.axis()
        .scale(y)
        .orient('left')
        .ticks(d3.time.days, 1) // 1 tick per day
        .tickSize(0)
        .tickFormat(d3.time.format('%Y-%m-%d'));
  
  svgContainer.append('g')
    .attr('transform' , 'translate(' + margin.left + ',0)')
    .call(yAxis);
  </code></pre>
  
  <p><strong>Problem: First data entry is missing (data[0].date: 2014-11-01)</strong>:</p>
  
  <p><img src="https://i.stack.imgur.com/TEQU3.png" alt="screenshot browser"></p>
  
  <p><img src="https://i.stack.imgur.com/JNvih.png" alt="screenshot browser debugging"></p>
  
  <p>Any ideas? Looks like off-by-one error, but I can't spot my mistake.</p>