title: Duplicate dates on x axis
body: <p>I created the attached function to remove the gaps and stop interpolation:</p>
  
  <pre><code>public static function fixDates($data) {
      $values = $data['values'];
      $fixed = [
          $values[0]
      ];
  
      $t1 = new \DateTime();
      $t2 = new \DateTime();
  
      for ($i = 1, $len = count($values); $i &lt; $len; $i++) {
          $t1-&gt;setTimestamp(($values[$i-1]['x']/1000) + 86400);
          $t2-&gt;setTimestamp($values[$i]['x']/1000);
  
          $interval = new \DateInterval('P1D');
          $daterange = new \DatePeriod($t1, $interval, $t2);
  
          foreach ($daterange as $date) {
              $fixed[] = ['x' =&gt; $date-&gt;getTimestamp() * 1000, 'y' =&gt; 0];
          }
  
          $fixed[] = [
              'x' =&gt; $t2-&gt;getTimestamp()*1000,
              'y' =&gt; $values[$i]['y']
          ];
      }
  
      $data['values'] = $fixed;
      return $data;
  }
  </code></pre>
  
  <p>It produces an output array (included with the nvd3 code) like so:</p>
  
  <pre><code>        nv.addGraph(function () {
              var chart = nv.models.lineChart();
              chart.yAxis.axisLabelDistance(35);
  
              chart.xAxis
                  .axisLabel('Time')
                  .tickFormat(function (d) {
                      return d3.time.format('%d %b')(new Date(d));
                  });
  
              chart.yAxis.axisLabelDistance(35);
  
              chart.yAxis
                  .axisLabel('# of devices')
                  .tickFormat(d3.format('d'));
  
              d3.select('#number_of_devices svg')
                  .datum([{
                      "key": "Applications",
                      "values": [{
                          "x": 1391155200000,
                          "y": 5
                      }, {
                          "x": 1391241600000,
                          "y": 0
                      }, {
                          "x": 1391328000000,
                          "y": 0
                      }, {
                          "x": 1391414400000,
                          "y": 6
                      }, {
                          "x": 1391500800000,
                          "y": 0
                      }, {
                          "x": 1391587200000,
                          "y": 0
                      }, {
                          "x": 1391673600000,
                          "y": 0
                      }, {
                          "x": 1391760000000,
                          "y": 0
                      }, {
                          "x": 1391846400000,
                          "y": 31
                      }, {
                          "x": 1391932800000,
                          "y": 8
                      }]
                  }])
                  .transition()
                  .duration(500)
                  .call(chart);
  
              nv.utils.windowResize(chart.update);
  
              return chart;
          });
  </code></pre>
  
  <p>This is working great, however, I have duplicate days showing up on the x axis, as shown in this picture: <a href="http://shutter.io/img/lvith8/raw" rel="nofollow">http://shutter.io/img/lvith8/raw</a></p>
  
  <p>Any ideas what i'm missing?</p>
  
  <p><strong>Edit:</strong></p>
  
  <p>It's unrelated to this dataset and only happens because it's a large graph width and low amount of datapoints. If I reduce the width of the graph and force it to update it fixes itself, but I'd still like it to work as expected at any width.</p>
  
  <p>I thought my tickFormatter ( <code>return d3.time.format('%d %b')(new Date(d));</code> ) would compensate for that.</p>