jqPlot调整

Question

告诉我，如果有人遇到过这个问题：

我展示使用jqPlot

<script language="javascript" type="text/javascript"> 

    $(document).ready(function() { 
      $.jqplot.config.enablePlugins = true; 
      var chLines = [[['09/30/2010 00:00:00',24.13],['12/31/2010 00:00:00',28.26],['03/31/2011 00:00:00',24.00],['06/30/2011 00:00:00',25.35],['09/30/2011 00:00:00',26.26],['12/31/2011 00:00:00',29.71]]]; 
      var chSeries = [{  color: '#436277',  label: 'label' }]; 
     var mnth; 
     var quarter; 

     $.jqplot.DateTickFormatter = function(format, val) { 
      if (!format) { 
       format = '%Y/%m/%d'; 
      }  

      if(format == '%Q') { 
       mnth = $.jsDate.strftime(val, '%#m'); 
       quarter = parseInt((mnth-1)/3) + 1; 
       return $.jsDate.strftime(val, '%Y') + 'Q' + quarter; 
      } 
      return $.jsDate.strftime(val, format); 
     }; 

     //$.jqplot.DateAxisRenderer.tickInterval = 86400000*32*3; 

     var plot = $.jqplot('content-chart', chLines, 
      { 
       //animate: !$.jqplot.use_excanvas, // Only animate if we're not using excanvas (not in IE 7 or IE 8)..   
       axes: { 
        xaxis: { 
         tickInterval: 86400000*32*3, 
         renderer: $.jqplot.DateAxisRenderer, 
         borderColor: 'black', 
         borderWidth: 0.5, 
         tickOptions: { 
          showGridline: false, 
          //formatString: '%b %Y', 
          formatString: '%Q', 
          textColor: 'black', 
          fontSize: '11px', 
         } 
        }, 
        yaxis: { 
         min: 0, 
         tickOptions: { 
          formatString: '%.2f', 
          textColor: 'black', 
          fontSize: '11px' 
         } 
        } 
       }, 
       highlighter: { 
        show: true, 
        sizeAdjust: 7.5 
       }, 
       seriesDefaults: { 
        lineWidth: 3 
       }, 

       series: chSeries, 
       legend: { 
        show: true, 
        location: 'sw',//compass direction, nw, n, ne, e, se, s, sw, w. 
        xoffset: 5, 
        yoffset: 5 
        //placement: 'outside' 
       }, 

       grid:{ 
        background: 'white', 
        borderColor: 'white', 
        shadow: false, 
        gridLineColor: '#999999' 
       } 
      }); 
      $(window).bind('resize', function(event, ui) {    
       plot.replot({ resetAxes: true }); 
      }); 
    }); 
</script> 

我看到刻度标记的X轴重复我的网页情节

但当窗口被调整大小时this.tickInterval对象在jqplot.dateAxisRenderer.js中createTicks函数变为null。我也试图在功能改变代码createTicks看起来像这样

this.tickInterval = 86400000 * 32 * 3; 
var tickInterval = this.tickInterval; 

但不幸的是刻度标记开始时，窗口大小碰到对方。

Answer 1

要解决您的问题，您必须先为日期轴（即轴X）设置'min'和'max'日期。显然，只有在设置'min'和'max'值时，渲染器才会使用'tickInterval'的值。这种问题实际上已经解决了 - 请参阅this answer。

因此使用这个建议，你需要设置以下参数如下：

tickInterval: "3 months", 
min: chLines[0][0][0], 
max: chLines[0][0][chLines[0].length-1] 

至于它会为你需要使用下面的大小调整位：

$(window).bind('resize', function(event, ui) {  
    if (plot) { 
     plot.replot(); 
    } 
}); 

Here is a working code sample made for your code.

---

编辑： 经过一段时间摆弄样本之后，我发现仍然存在一些认为不可见的问题，因为格式覆盖了它。由于它出现的min，max和tickInterval设置是不够的值仍然不是每3个月为每个刻度显示30天，而且有时应该是31

The only solution then I figured out was to set the ticks myself.在这种情况下，你不需要min， max和tickInterval。

Answer 2

对于我更新jqplot解决了刻度标记运行到对方，以解决tickinterval不灵看到这里接受答案的问题的问题：

jqPlot DateAxis tickInterval not working