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