title: D3.js time scale: nicely-spaced ticks at minute intervals when data is in seconds?
body: <p>I'm working with a D3 time scale. My input data is in seconds, and it's duration data rather than dates - so 10 seconds, 30 seconds etc. </p>
  
  <p>I want to create an axis that lets me do the following: </p>
  
  <ul>
  <li>Display ticks formatted in minutes and seconds: like "0m 30s", "1m 00s", etc. This formatting on its own is fairly straightforward, but not when I also need to...</li>
  <li>Display ticks at intervals that look neat when formatted in minutes. If I just use D3's default tick formatting then I get ticks at intervals that make sense in minutes, but not seconds. </li>
  </ul>
  
  <p>Here is my code: </p>
  
  <pre><code>var values = [100,200,300....]; // values in seconds
  var formatCount = d3.format(",.0f"),
      formatTime = d3.time.format("%Mm %Ss"),
      formatMinutes = function(d) { 
          var t = new Date(2012, 0, 1, 0, 0, d);
          t.setSeconds(t.getSeconds() + d);
          return formatTime(t); 
      };
  var x = d3.scale.linear()
      .domain([0, d3.max(values)])
      .range([0, width]);
  var xAxis = d3.svg.axis()
      .scale(x)
      .orient("bottom")
      .tickFormat(formatMinutes);
  </code></pre>
  
  <p>This gives me nicely-formatted ticks at irregular intervals: "16m 40s", "33m 20s" etc. How can I generate ticks at "10m 00s", "20m 00s", etc?</p>
  
  <p>The obvious answer would be to transform the values array into minutes, use a linear scale and write a formatter to handle it, but I'd prefer to use a time scale if possible </p>
  
  <p>Here is a JSFiddle to demonstrate the problem: <a href="http://jsfiddle.net/83Xmf/" rel="noreferrer">http://jsfiddle.net/83Xmf/</a></p>