jQuery flot：graphTable插件如何显示月份

我忙于静态，现在我想显示一些月份而不是数字。但是当我在表格中列出几个月的名字时，静态数据会变得疯狂。jQuery flot：graphTable插件如何显示月份

当你使用数字一切正常，但我想在x轴使用数字和月份。

我希望有人能帮助我。

2011-08-26 Maanstraat

我厌倦了FLOT处理时间戳的方式。 automatick tick产生器太多了（见上面我最后的评论）。更好地做你自己的事情。转换的“月”阵列偏移月份名称到，然后使用：

xaxis: {tickSize: 1; tickFormatter: function(v, a) {return months[v]}}

得到你想要的x轴。

$("table.statics-date").each(function() { 
    var colors = []; 
    var months = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"]; 

    $("table.statics-date thead th:not(:first)").each(function() { 
     colors.push($(this).css("color")); 
    }); 
    $(this).graphTable({ 
     series: 'columns', 
     position: 'replace', 
     height: '200px', 
     colors: colors, 
     xaxisTransform: function(month) { 
      var i=0; 
      while ((i < 12) && (month != months[i])){i++} 
      return i; 
     } 
    }, { 
     xaxis: { 
      tickSize: 1, 
      tickFormatter: function(v, a) {return months[v]} 
     } 
    }); 
});

你必须做手脚了一下，当你GOVER一年年底（日 - >月），但代码是不是太困难。

见我这样的jsfiddle在：http://jsfiddle.net/G4TJ3/6/ 问候尼尔

来源

2011-08-30 14:16:42 Neil

嗨尼尔，这真棒！：）非常感谢！ – Maanstraat

链接已损坏 –

您需要在graphTable选项中包含一个“xaxisTransform”选项，并添加第二个参数“xaxis”选项以“flot”本身。基本上你必须将月份名称转换为要绘制的时间戳，然后将时间戳转换回x轴的月份。

旅游呼叫graphTable应该是这样的：

$(this).graphTable({ 
    series:  'columns', 
    position:  'replace', 
    height:  '200px', 
    colors:   colors, 
    xaxisTransform: function(month){return Date.parse(month + ' 1, 1970');} 
    } 
    , 
    { 
    xaxis: { 
      mode:  'time', 
      timeformat: '%b' 
      } 
    } 
);

我已经检查这在您的jsfiddle和它的作品。

您不必使用时间戳。你可以提供你自己的功能，例如在xaxisTransform可能只是转换月份名称即可偏移[0-11]，而对于海军报的选项，你会使用，而不是：

xaxis: { 
      transform: function(monthOffset){return ..monthname as a string..;} 
      }

实际上是最后一位是错的，我觉得应该是“改造” AND 'inverseTransform'。 Registers Neil

来源

2011-08-26 11:49:00 Neil

喜尼尔，日Thnx这是工作！但是当你有12个月的时间（1月 - 12月）时，你不会在xasis中看到Dec？这是为什么？ http://jsfiddle.net/G4TJ3/ ...在IE中这是行不通的？ – Maanstraat

嗨，关于IE，从https://github.com/flot/flot网页：通常，所有支持HTML5 canvas标签的浏览器都支持。为了支持Internet Explorer <9，您可以使用Excanvas，一个画布模拟器;这在与Flot捆绑的例子中使用。你只包括这样的excanvas脚本：<！ - [如果LTE IE 8]> – Neil

关于12月“不出现，这是关于在x轴上自动生成滴答。一个软肋是改变代码说：xaxisTransform：function（month）{ return（month =='Jan'）？ Date.parse（month +'1，1970'）：Date.parse（month +'2，1970'）; }您可能还想添加“xaxis”选项“ticks：12”。 – Neil

我使用timeformat:"%d %b %y"述明的flot official docs

%a: weekday name (customizable) 
%b: month name (customizable) 
%d: day of month, zero-padded (01-31) 
%e: day of month, space-padded (1-31) 
%H: hours, 24-hour time, zero-padded (00-23) 
%I: hours, 12-hour time, zero-padded (01-12) 
%m: month, zero-padded (01-12) 
%M: minutes, zero-padded (00-59) 
%q: quarter (1-4) 
%S: seconds, zero-padded (00-59) 
%y: year (two digits) 
%Y: year (four digits) 
%p: am/pm 
%P: AM/PM (uppercase version of %p) 
%w: weekday as number (0-6, 0 being Sunday)

jsfiddle link

来源

2014-12-12 06:00:13 abi1964

jQuery flot：graphTable插件如何显示月份

回答

相关问题