当日期在天，月或年之间变化时，根据折线图中的数字绘制日期

Question

我有一个json数据，其中包含日期和数字。日期从几天到几个月不等。如何根据收到的数据绘制图表，使日期自行调整？如果我没有给出任何刻度计数，则x轴上的刻度标签开始重叠。

以下是折线图的代码。

 var createLineChart = function(data){
    var convertToISODate = function(d) {
      return new Date(d.date);
    }

    // get max and min dates, provided data is in sorted order
    var minDate = convertToISODate(data[0]),
        maxDate = convertToISODate(data[data.length-1]);

    var minAccuracy = d3.min(data, function(d) {
      return (d.ad_review_stats.accuracy);
    });
    var maxAccuracy = d3.max(data, function(d) {
      return (d.ad_review_stats.accuracy);
    });
    var differenceInAccuracy = (maxAccuracy - minAccuracy)/2;

    var formatYAxis= d3.format('.2f');
    var formatXAxis = d3.time.format("%d-%b-%y");
    var d3Graph = d3.select("#lineGraph"),
      widthOfGraph = 400,
      heightOfGraph = 200,
      marginsForGraph = {
          top: 20,
          right: 20,
          bottom: 20,
          left: 50
      },
      xScale = d3.time.scale().
              range([marginsForGraph.left, widthOfGraph - marginsForGraph.right]).
              domain([minDate, maxDate]),

      yScale = d3.scale.linear().
              range([heightOfGraph - marginsForGraph.top, marginsForGraph.bottom]).
              domain([(minAccuracy - differenceInAccuracy), 
                (maxAccuracy + differenceInAccuracy)]);

      xAxis = d3.svg.axis()
        .scale(xScale)
        .tickFormat(formatXAxis),

      yAxis = d3.svg.axis()
        .scale(yScale)
        .orient("left")
        .tickFormat(formatYAxis);

    d3Graph.append("svg:g")
      .attr("transform", "translate(0," + (heightOfGraph - marginsForGraph.bottom) + ")")
      .call(xAxis);

    d3Graph.append("svg:g")
    .attr("transform", "translate(" + (marginsForGraph.left) + ",0)")
    .call(yAxis);

    var lineGeneratorFunction = d3.svg.line()
      .x(function(d) {
        return xScale(convertToISODate(d));
      })
      .y(function(d) {
        return yScale(Math.round(d.ad_review_stats.accuracy * 100) / 100);
      })
      .interpolate("cardinal");

    var divForTooltip = d3.select("body").append("div")   
    .attr("class", "tooltip")               
    .style("opacity", 0);

    d3Graph.append('svg:path')
      .attr('d', lineGeneratorFunction(data))
      .attr('stroke', 'rgb(44, 160, 44)')
      .attr('stroke-width', 4)
      .attr('fill', 'none');

    d3Graph.selectAll("circle.line")
      .data(data)
      .enter().append("svg:circle")
      .attr("class", "line")
      .style("fill", "rgb(44, 160, 44)")
      .attr("cx", function(d) { 
        return xScale(convertToISODate(d)) 
      })
      .attr("cy", function(d) { 
        return yScale(d.ad_review_stats.accuracy);
      })
      .attr("r", 2)

      .on("mouseover", function(d) {
          d3.select(this).transition()
            .duration(200)
            .attr("r", 8);

          divForTooltip.transition()        
              .duration(200)      
              .style("opacity", .9);      
          divForTooltip.html(d.ad_review_stats.accuracy + ", "  + d.date)  
              .style("left", (d3.event.pageX) + "px")     
              .style("top", (d3.event.pageY - 28) + "px");    
          })                  
      .on("mouseout", function(d) {  
          d3.select(this).transition()
          .duration(200)
          .attr("r", 2);   

          divForTooltip.transition()        
            .duration(500)      
            .style("opacity", 0);   
      });
  };

你可以看到这里的小提琴： https://jsfiddle.net/k98Lxrkf/

非常感谢任何帮助。