2016-07-01 16 views
0

私のページにカスタムの日付フィルタがあります。ユーザーは最大2ヶ月のデータを選択することができます唯一の60日を意味します。今ではフィルタリング時に60日間データを取得しましたが、それをflotチャートに渡すとチャートに30日しか表示されません。誰でもこのことで私を助けることができますか?ここに私のコードは次のとおりです。ここでFlot chart day binding issue

(function() { 
    var plot = $.plot('#flotBars', flotBarsData, { 
     colors: ['#8CC9E8'], 
     series: { 
      bars: { 
       show: true, 
       barWidth: 0.8, 
       align: 'center' 
      } 
     }, 
     xaxis: { 
      mode: 'categories', 
      tickLength: 0 
     }, 
     grid: { 
      hoverable: true, 
      clickable: true, 
      borderColor: 'rgba(0,0,0,0.1)', 
      borderWidth: 1, 
      labelMargin: 15, 
      backgroundColor: 'transparent' 
     }, 
     tooltip: true, 
     tooltipOpts: { 
      content: '%y', 
      shifts: { 
       x: -10, 
       y: 20 
      }, 
      defaultTheme: false 
     }, 
     yaxis: { 
      minTickSize: 0, 
      tickDecimals: 0, 
      min: 0, 
      axisLabelPadding: 3, 
      tickFormatter: function (v, axis) { 
       return v; 
      } 
     }, 
     legend: { 
      noColumns: 0, 
      labelBoxBorderColor: "#000000", 
      position: "nw" 
     } 
    }); 
})(); 

は私のチャートおよびフィルタ選択のスクリーンショットです: enter image description here

答えて

0

スクリーンショットに見られるように、あなたはx軸上のみの31のカテゴリーがあり、それぞれにpresumely 1日。いくつかの日には、お互いの後ろに2つのバーがあり、毎月1つあります。

カテゴリモードを引き続き使用するには、データに固有のx軸値(たとえば、1から61までの実行番号)を指定する必要があります。または、時間モードを使用し、x軸に実際の日付を表示します(documentationおよびexample時間モードと表示してください)。

+0

回答ありがとうございます。この61日間のデータを表示できる方法はありますか? –

+0

はい、私の答えの2番目の部分を参照してください。 – Raidri

+0

私は実際の日付を表示すると、見栄えが良くなくても読み込みができなくなると思います。 –

関連する問題